From 175ef76561dd5421dbefe501a6ca1814b1e4b762 Mon Sep 17 00:00:00 2001 From: Samuel Reed Date: Sat, 31 Oct 2026 16:33:35 -0400 Subject: [PATCH 1/6] test: pin resize interactions before behavior refactors Freeze callback order, event kinds, handle identity, DOM sizes and layout reads through real DraggableCore events. Moving fake layout and two render cadences expose north/west correction and stale-prop accumulation. Keep audited bugs as named goldens so fixes require intentional trace diffs. Type-check test support and run all golden cases in the normal suite. --- __tests__/golden/README.md | 79 ++++++++++ ...ndles-both-bottomright-batched.golden.json | 55 +++++++ ...les-both-bottomright-per-event.golden.json | 47 ++++++ ...l-handles-both-topleft-batched.golden.json | 55 +++++++ ...handles-both-topleft-per-event.golden.json | 47 ++++++ ...ndles-none-bottomright-batched.golden.json | 55 +++++++ ...les-none-bottomright-per-event.golden.json | 47 ++++++ ...l-handles-none-topleft-batched.golden.json | 55 +++++++ ...handles-none-topleft-per-event.golden.json | 47 ++++++ ...-handles-x-bottomright-batched.golden.json | 55 +++++++ ...andles-x-bottomright-per-event.golden.json | 47 ++++++ ...-all-handles-x-topleft-batched.golden.json | 55 +++++++ ...ll-handles-x-topleft-per-event.golden.json | 47 ++++++ ...-handles-y-bottomright-batched.golden.json | 55 +++++++ ...andles-y-bottomright-per-event.golden.json | 47 ++++++ ...-all-handles-y-topleft-batched.golden.json | 55 +++++++ ...ll-handles-y-topleft-per-event.golden.json | 47 ++++++ ...-max-binding-return-lock-false.golden.json | 13 ++ ...s-max-binding-return-lock-true.golden.json | 13 ++ ...nts-max-not-binding-lock-false.golden.json | 12 ++ ...ints-max-not-binding-lock-true.golden.json | 12 ++ ...-min-binding-return-lock-false.golden.json | 13 ++ ...s-min-binding-return-lock-true.golden.json | 13 ++ ...nts-min-not-binding-lock-false.golden.json | 12 ++ ...ints-min-not-binding-lock-true.golden.json | 12 ++ ...aints-tight-min-max-lock-false.golden.json | 13 ++ ...raints-tight-min-max-lock-true.golden.json | 13 ++ ...nstraints-unbounded-lock-false.golden.json | 12 ++ ...onstraints-unbounded-lock-true.golden.json | 12 ++ ...ble-e-both-bottomright-batched.golden.json | 13 ++ ...e-e-both-bottomright-per-event.golden.json | 12 ++ ...sizable-e-both-topleft-batched.golden.json | 13 ++ ...zable-e-both-topleft-per-event.golden.json | 12 ++ ...ble-e-none-bottomright-batched.golden.json | 13 ++ ...e-e-none-bottomright-per-event.golden.json | 12 ++ ...sizable-e-none-topleft-batched.golden.json | 13 ++ ...zable-e-none-topleft-per-event.golden.json | 12 ++ ...izable-e-x-bottomright-batched.golden.json | 13 ++ ...able-e-x-bottomright-per-event.golden.json | 12 ++ .../Resizable-e-x-topleft-batched.golden.json | 13 ++ ...esizable-e-x-topleft-per-event.golden.json | 12 ++ ...izable-e-y-bottomright-batched.golden.json | 13 ++ ...able-e-y-bottomright-per-event.golden.json | 12 ++ .../Resizable-e-y-topleft-batched.golden.json | 13 ++ ...esizable-e-y-topleft-per-event.golden.json | 12 ++ ...ble-n-both-bottomright-batched.golden.json | 13 ++ ...e-n-both-bottomright-per-event.golden.json | 12 ++ ...sizable-n-both-topleft-batched.golden.json | 13 ++ ...zable-n-both-topleft-per-event.golden.json | 12 ++ ...ble-n-none-bottomright-batched.golden.json | 13 ++ ...e-n-none-bottomright-per-event.golden.json | 12 ++ ...sizable-n-none-topleft-batched.golden.json | 13 ++ ...zable-n-none-topleft-per-event.golden.json | 12 ++ ...izable-n-x-bottomright-batched.golden.json | 13 ++ ...able-n-x-bottomright-per-event.golden.json | 12 ++ .../Resizable-n-x-topleft-batched.golden.json | 13 ++ ...esizable-n-x-topleft-per-event.golden.json | 12 ++ ...izable-n-y-bottomright-batched.golden.json | 13 ++ ...able-n-y-bottomright-per-event.golden.json | 12 ++ .../Resizable-n-y-topleft-batched.golden.json | 13 ++ ...esizable-n-y-topleft-per-event.golden.json | 12 ++ ...le-ne-both-bottomright-batched.golden.json | 13 ++ ...-ne-both-bottomright-per-event.golden.json | 12 ++ ...izable-ne-both-topleft-batched.golden.json | 13 ++ ...able-ne-both-topleft-per-event.golden.json | 12 ++ ...le-ne-none-bottomright-batched.golden.json | 13 ++ ...-ne-none-bottomright-per-event.golden.json | 12 ++ ...izable-ne-none-topleft-batched.golden.json | 13 ++ ...able-ne-none-topleft-per-event.golden.json | 12 ++ ...zable-ne-x-bottomright-batched.golden.json | 13 ++ ...ble-ne-x-bottomright-per-event.golden.json | 12 ++ ...Resizable-ne-x-topleft-batched.golden.json | 13 ++ ...sizable-ne-x-topleft-per-event.golden.json | 12 ++ ...zable-ne-y-bottomright-batched.golden.json | 13 ++ ...ble-ne-y-bottomright-per-event.golden.json | 12 ++ ...Resizable-ne-y-topleft-batched.golden.json | 13 ++ ...sizable-ne-y-topleft-per-event.golden.json | 12 ++ ...le-nw-both-bottomright-batched.golden.json | 13 ++ ...-nw-both-bottomright-per-event.golden.json | 12 ++ ...izable-nw-both-topleft-batched.golden.json | 13 ++ ...able-nw-both-topleft-per-event.golden.json | 12 ++ ...le-nw-none-bottomright-batched.golden.json | 13 ++ ...-nw-none-bottomright-per-event.golden.json | 12 ++ ...izable-nw-none-topleft-batched.golden.json | 13 ++ ...able-nw-none-topleft-per-event.golden.json | 12 ++ ...zable-nw-x-bottomright-batched.golden.json | 13 ++ ...ble-nw-x-bottomright-per-event.golden.json | 12 ++ ...Resizable-nw-x-topleft-batched.golden.json | 13 ++ ...sizable-nw-x-topleft-per-event.golden.json | 12 ++ ...zable-nw-y-bottomright-batched.golden.json | 13 ++ ...ble-nw-y-bottomright-per-event.golden.json | 12 ++ ...Resizable-nw-y-topleft-batched.golden.json | 13 ++ ...sizable-nw-y-topleft-per-event.golden.json | 12 ++ .../Resizable-options-0-0.golden.json | 12 ++ .../Resizable-options-0-1.golden.json | 13 ++ .../Resizable-options-0-2.golden.json | 12 ++ .../Resizable-options-0-3.golden.json | 13 ++ .../Resizable-options-1-0.golden.json | 12 ++ .../Resizable-options-1-1.golden.json | 13 ++ .../Resizable-options-1-2.golden.json | 12 ++ .../Resizable-options-1-3.golden.json | 13 ++ .../Resizable-options-2-0.golden.json | 13 ++ .../Resizable-options-2-1.golden.json | 12 ++ .../Resizable-options-2-2.golden.json | 13 ++ .../Resizable-options-2-3.golden.json | 12 ++ .../Resizable-options-3-0.golden.json | 13 ++ .../Resizable-options-3-1.golden.json | 12 ++ .../Resizable-options-3-2.golden.json | 13 ++ .../Resizable-options-3-3.golden.json | 12 ++ ...ble-s-both-bottomright-batched.golden.json | 13 ++ ...e-s-both-bottomright-per-event.golden.json | 12 ++ ...sizable-s-both-topleft-batched.golden.json | 13 ++ ...zable-s-both-topleft-per-event.golden.json | 12 ++ ...ble-s-none-bottomright-batched.golden.json | 13 ++ ...e-s-none-bottomright-per-event.golden.json | 12 ++ ...sizable-s-none-topleft-batched.golden.json | 13 ++ ...zable-s-none-topleft-per-event.golden.json | 12 ++ ...izable-s-x-bottomright-batched.golden.json | 13 ++ ...able-s-x-bottomright-per-event.golden.json | 12 ++ .../Resizable-s-x-topleft-batched.golden.json | 13 ++ ...esizable-s-x-topleft-per-event.golden.json | 12 ++ ...izable-s-y-bottomright-batched.golden.json | 13 ++ ...able-s-y-bottomright-per-event.golden.json | 12 ++ .../Resizable-s-y-topleft-batched.golden.json | 13 ++ ...esizable-s-y-topleft-per-event.golden.json | 12 ++ ...le-se-both-bottomright-batched.golden.json | 13 ++ ...-se-both-bottomright-per-event.golden.json | 12 ++ ...izable-se-both-topleft-batched.golden.json | 13 ++ ...able-se-both-topleft-per-event.golden.json | 12 ++ ...le-se-none-bottomright-batched.golden.json | 13 ++ ...-se-none-bottomright-per-event.golden.json | 12 ++ ...izable-se-none-topleft-batched.golden.json | 13 ++ ...able-se-none-topleft-per-event.golden.json | 12 ++ ...zable-se-x-bottomright-batched.golden.json | 13 ++ ...ble-se-x-bottomright-per-event.golden.json | 12 ++ ...Resizable-se-x-topleft-batched.golden.json | 13 ++ ...sizable-se-x-topleft-per-event.golden.json | 12 ++ ...zable-se-y-bottomright-batched.golden.json | 13 ++ ...ble-se-y-bottomright-per-event.golden.json | 12 ++ ...Resizable-se-y-topleft-batched.golden.json | 13 ++ ...sizable-se-y-topleft-per-event.golden.json | 12 ++ ...le-sw-both-bottomright-batched.golden.json | 13 ++ ...-sw-both-bottomright-per-event.golden.json | 12 ++ ...izable-sw-both-topleft-batched.golden.json | 13 ++ ...able-sw-both-topleft-per-event.golden.json | 12 ++ ...le-sw-none-bottomright-batched.golden.json | 13 ++ ...-sw-none-bottomright-per-event.golden.json | 12 ++ ...izable-sw-none-topleft-batched.golden.json | 13 ++ ...able-sw-none-topleft-per-event.golden.json | 12 ++ ...zable-sw-x-bottomright-batched.golden.json | 13 ++ ...ble-sw-x-bottomright-per-event.golden.json | 12 ++ ...Resizable-sw-x-topleft-batched.golden.json | 13 ++ ...sizable-sw-x-topleft-per-event.golden.json | 12 ++ ...zable-sw-y-bottomright-batched.golden.json | 13 ++ ...ble-sw-y-bottomright-per-event.golden.json | 12 ++ ...Resizable-sw-y-topleft-batched.golden.json | 13 ++ ...sizable-sw-y-topleft-per-event.golden.json | 12 ++ ...ble-w-both-bottomright-batched.golden.json | 13 ++ ...e-w-both-bottomright-per-event.golden.json | 12 ++ ...sizable-w-both-topleft-batched.golden.json | 13 ++ ...zable-w-both-topleft-per-event.golden.json | 12 ++ ...ble-w-none-bottomright-batched.golden.json | 13 ++ ...e-w-none-bottomright-per-event.golden.json | 12 ++ ...sizable-w-none-topleft-batched.golden.json | 13 ++ ...zable-w-none-topleft-per-event.golden.json | 12 ++ ...izable-w-x-bottomright-batched.golden.json | 13 ++ ...able-w-x-bottomright-per-event.golden.json | 12 ++ .../Resizable-w-x-topleft-batched.golden.json | 13 ++ ...esizable-w-x-topleft-per-event.golden.json | 12 ++ ...izable-w-y-bottomright-batched.golden.json | 13 ++ ...able-w-y-bottomright-per-event.golden.json | 12 ++ .../Resizable-w-y-topleft-batched.golden.json | 13 ++ ...esizable-w-y-topleft-per-event.golden.json | 12 ++ ...ndles-both-bottomright-batched.golden.json | 55 +++++++ ...les-both-bottomright-per-event.golden.json | 47 ++++++ ...l-handles-both-topleft-batched.golden.json | 55 +++++++ ...handles-both-topleft-per-event.golden.json | 47 ++++++ ...ndles-none-bottomright-batched.golden.json | 55 +++++++ ...les-none-bottomright-per-event.golden.json | 47 ++++++ ...l-handles-none-topleft-batched.golden.json | 55 +++++++ ...handles-none-topleft-per-event.golden.json | 47 ++++++ ...-handles-x-bottomright-batched.golden.json | 55 +++++++ ...andles-x-bottomright-per-event.golden.json | 47 ++++++ ...-all-handles-x-topleft-batched.golden.json | 55 +++++++ ...ll-handles-x-topleft-per-event.golden.json | 47 ++++++ ...-handles-y-bottomright-batched.golden.json | 55 +++++++ ...andles-y-bottomright-per-event.golden.json | 47 ++++++ ...-all-handles-y-topleft-batched.golden.json | 55 +++++++ ...ll-handles-y-topleft-per-event.golden.json | 47 ++++++ ...-max-binding-return-lock-false.golden.json | 13 ++ ...s-max-binding-return-lock-true.golden.json | 13 ++ ...nts-max-not-binding-lock-false.golden.json | 12 ++ ...ints-max-not-binding-lock-true.golden.json | 12 ++ ...-min-binding-return-lock-false.golden.json | 13 ++ ...s-min-binding-return-lock-true.golden.json | 13 ++ ...nts-min-not-binding-lock-false.golden.json | 12 ++ ...ints-min-not-binding-lock-true.golden.json | 12 ++ ...aints-tight-min-max-lock-false.golden.json | 13 ++ ...raints-tight-min-max-lock-true.golden.json | 13 ++ ...nstraints-unbounded-lock-false.golden.json | 12 ++ ...onstraints-unbounded-lock-true.golden.json | 12 ++ ...Box-e-both-bottomright-batched.golden.json | 13 ++ ...x-e-both-bottomright-per-event.golden.json | 12 ++ ...ableBox-e-both-topleft-batched.golden.json | 13 ++ ...leBox-e-both-topleft-per-event.golden.json | 12 ++ ...Box-e-none-bottomright-batched.golden.json | 13 ++ ...x-e-none-bottomright-per-event.golden.json | 12 ++ ...ableBox-e-none-topleft-batched.golden.json | 13 ++ ...leBox-e-none-topleft-per-event.golden.json | 12 ++ ...bleBox-e-x-bottomright-batched.golden.json | 13 ++ ...eBox-e-x-bottomright-per-event.golden.json | 12 ++ ...sizableBox-e-x-topleft-batched.golden.json | 13 ++ ...zableBox-e-x-topleft-per-event.golden.json | 12 ++ ...bleBox-e-y-bottomright-batched.golden.json | 13 ++ ...eBox-e-y-bottomright-per-event.golden.json | 12 ++ ...sizableBox-e-y-topleft-batched.golden.json | 13 ++ ...zableBox-e-y-topleft-per-event.golden.json | 12 ++ ...Box-n-both-bottomright-batched.golden.json | 13 ++ ...x-n-both-bottomright-per-event.golden.json | 12 ++ ...ableBox-n-both-topleft-batched.golden.json | 13 ++ ...leBox-n-both-topleft-per-event.golden.json | 12 ++ ...Box-n-none-bottomright-batched.golden.json | 13 ++ ...x-n-none-bottomright-per-event.golden.json | 12 ++ ...ableBox-n-none-topleft-batched.golden.json | 13 ++ ...leBox-n-none-topleft-per-event.golden.json | 12 ++ ...bleBox-n-x-bottomright-batched.golden.json | 13 ++ ...eBox-n-x-bottomright-per-event.golden.json | 12 ++ ...sizableBox-n-x-topleft-batched.golden.json | 13 ++ ...zableBox-n-x-topleft-per-event.golden.json | 12 ++ ...bleBox-n-y-bottomright-batched.golden.json | 13 ++ ...eBox-n-y-bottomright-per-event.golden.json | 12 ++ ...sizableBox-n-y-topleft-batched.golden.json | 13 ++ ...zableBox-n-y-topleft-per-event.golden.json | 12 ++ ...ox-ne-both-bottomright-batched.golden.json | 13 ++ ...-ne-both-bottomright-per-event.golden.json | 12 ++ ...bleBox-ne-both-topleft-batched.golden.json | 13 ++ ...eBox-ne-both-topleft-per-event.golden.json | 12 ++ ...ox-ne-none-bottomright-batched.golden.json | 13 ++ ...-ne-none-bottomright-per-event.golden.json | 12 ++ ...bleBox-ne-none-topleft-batched.golden.json | 13 ++ ...eBox-ne-none-topleft-per-event.golden.json | 12 ++ ...leBox-ne-x-bottomright-batched.golden.json | 13 ++ ...Box-ne-x-bottomright-per-event.golden.json | 12 ++ ...izableBox-ne-x-topleft-batched.golden.json | 13 ++ ...ableBox-ne-x-topleft-per-event.golden.json | 12 ++ ...leBox-ne-y-bottomright-batched.golden.json | 13 ++ ...Box-ne-y-bottomright-per-event.golden.json | 12 ++ ...izableBox-ne-y-topleft-batched.golden.json | 13 ++ ...ableBox-ne-y-topleft-per-event.golden.json | 12 ++ ...ox-nw-both-bottomright-batched.golden.json | 13 ++ ...-nw-both-bottomright-per-event.golden.json | 12 ++ ...bleBox-nw-both-topleft-batched.golden.json | 13 ++ ...eBox-nw-both-topleft-per-event.golden.json | 12 ++ ...ox-nw-none-bottomright-batched.golden.json | 13 ++ ...-nw-none-bottomright-per-event.golden.json | 12 ++ ...bleBox-nw-none-topleft-batched.golden.json | 13 ++ ...eBox-nw-none-topleft-per-event.golden.json | 12 ++ ...leBox-nw-x-bottomright-batched.golden.json | 13 ++ ...Box-nw-x-bottomright-per-event.golden.json | 12 ++ ...izableBox-nw-x-topleft-batched.golden.json | 13 ++ ...ableBox-nw-x-topleft-per-event.golden.json | 12 ++ ...leBox-nw-y-bottomright-batched.golden.json | 13 ++ ...Box-nw-y-bottomright-per-event.golden.json | 12 ++ ...izableBox-nw-y-topleft-batched.golden.json | 13 ++ ...ableBox-nw-y-topleft-per-event.golden.json | 12 ++ .../ResizableBox-options-0-0.golden.json | 12 ++ .../ResizableBox-options-0-1.golden.json | 13 ++ .../ResizableBox-options-0-2.golden.json | 12 ++ .../ResizableBox-options-0-3.golden.json | 13 ++ .../ResizableBox-options-1-0.golden.json | 12 ++ .../ResizableBox-options-1-1.golden.json | 13 ++ .../ResizableBox-options-1-2.golden.json | 12 ++ .../ResizableBox-options-1-3.golden.json | 13 ++ .../ResizableBox-options-2-0.golden.json | 13 ++ .../ResizableBox-options-2-1.golden.json | 12 ++ .../ResizableBox-options-2-2.golden.json | 13 ++ .../ResizableBox-options-2-3.golden.json | 12 ++ .../ResizableBox-options-3-0.golden.json | 13 ++ .../ResizableBox-options-3-1.golden.json | 12 ++ .../ResizableBox-options-3-2.golden.json | 13 ++ .../ResizableBox-options-3-3.golden.json | 12 ++ ...Box-s-both-bottomright-batched.golden.json | 13 ++ ...x-s-both-bottomright-per-event.golden.json | 12 ++ ...ableBox-s-both-topleft-batched.golden.json | 13 ++ ...leBox-s-both-topleft-per-event.golden.json | 12 ++ ...Box-s-none-bottomright-batched.golden.json | 13 ++ ...x-s-none-bottomright-per-event.golden.json | 12 ++ ...ableBox-s-none-topleft-batched.golden.json | 13 ++ ...leBox-s-none-topleft-per-event.golden.json | 12 ++ ...bleBox-s-x-bottomright-batched.golden.json | 13 ++ ...eBox-s-x-bottomright-per-event.golden.json | 12 ++ ...sizableBox-s-x-topleft-batched.golden.json | 13 ++ ...zableBox-s-x-topleft-per-event.golden.json | 12 ++ ...bleBox-s-y-bottomright-batched.golden.json | 13 ++ ...eBox-s-y-bottomright-per-event.golden.json | 12 ++ ...sizableBox-s-y-topleft-batched.golden.json | 13 ++ ...zableBox-s-y-topleft-per-event.golden.json | 12 ++ ...ox-se-both-bottomright-batched.golden.json | 13 ++ ...-se-both-bottomright-per-event.golden.json | 12 ++ ...bleBox-se-both-topleft-batched.golden.json | 13 ++ ...eBox-se-both-topleft-per-event.golden.json | 12 ++ ...ox-se-none-bottomright-batched.golden.json | 13 ++ ...-se-none-bottomright-per-event.golden.json | 12 ++ ...bleBox-se-none-topleft-batched.golden.json | 13 ++ ...eBox-se-none-topleft-per-event.golden.json | 12 ++ ...leBox-se-x-bottomright-batched.golden.json | 13 ++ ...Box-se-x-bottomright-per-event.golden.json | 12 ++ ...izableBox-se-x-topleft-batched.golden.json | 13 ++ ...ableBox-se-x-topleft-per-event.golden.json | 12 ++ ...leBox-se-y-bottomright-batched.golden.json | 13 ++ ...Box-se-y-bottomright-per-event.golden.json | 12 ++ ...izableBox-se-y-topleft-batched.golden.json | 13 ++ ...ableBox-se-y-topleft-per-event.golden.json | 12 ++ ...ox-sw-both-bottomright-batched.golden.json | 13 ++ ...-sw-both-bottomright-per-event.golden.json | 12 ++ ...bleBox-sw-both-topleft-batched.golden.json | 13 ++ ...eBox-sw-both-topleft-per-event.golden.json | 12 ++ ...ox-sw-none-bottomright-batched.golden.json | 13 ++ ...-sw-none-bottomright-per-event.golden.json | 12 ++ ...bleBox-sw-none-topleft-batched.golden.json | 13 ++ ...eBox-sw-none-topleft-per-event.golden.json | 12 ++ ...leBox-sw-x-bottomright-batched.golden.json | 13 ++ ...Box-sw-x-bottomright-per-event.golden.json | 12 ++ ...izableBox-sw-x-topleft-batched.golden.json | 13 ++ ...ableBox-sw-x-topleft-per-event.golden.json | 12 ++ ...leBox-sw-y-bottomright-batched.golden.json | 13 ++ ...Box-sw-y-bottomright-per-event.golden.json | 12 ++ ...izableBox-sw-y-topleft-batched.golden.json | 13 ++ ...ableBox-sw-y-topleft-per-event.golden.json | 12 ++ ...Box-w-both-bottomright-batched.golden.json | 13 ++ ...x-w-both-bottomright-per-event.golden.json | 12 ++ ...ableBox-w-both-topleft-batched.golden.json | 13 ++ ...leBox-w-both-topleft-per-event.golden.json | 12 ++ ...Box-w-none-bottomright-batched.golden.json | 13 ++ ...x-w-none-bottomright-per-event.golden.json | 12 ++ ...ableBox-w-none-topleft-batched.golden.json | 13 ++ ...leBox-w-none-topleft-per-event.golden.json | 12 ++ ...bleBox-w-x-bottomright-batched.golden.json | 13 ++ ...eBox-w-x-bottomright-per-event.golden.json | 12 ++ ...sizableBox-w-x-topleft-batched.golden.json | 13 ++ ...zableBox-w-x-topleft-per-event.golden.json | 12 ++ ...bleBox-w-y-bottomright-batched.golden.json | 13 ++ ...eBox-w-y-bottomright-per-event.golden.json | 12 ++ ...sizableBox-w-y-topleft-batched.golden.json | 13 ++ ...zableBox-w-y-topleft-per-event.golden.json | 12 ++ .../box-cadence-B-stale-props-255.golden.json | 13 ++ ...rowser-Resizable-e-bottomright.golden.json | 12 ++ .../browser-Resizable-e-topleft.golden.json | 12 ++ ...rowser-Resizable-n-bottomright.golden.json | 12 ++ .../browser-Resizable-n-topleft.golden.json | 12 ++ ...owser-Resizable-ne-bottomright.golden.json | 12 ++ .../browser-Resizable-ne-topleft.golden.json | 12 ++ ...owser-Resizable-nw-bottomright.golden.json | 12 ++ .../browser-Resizable-nw-topleft.golden.json | 12 ++ ...rowser-Resizable-s-bottomright.golden.json | 12 ++ .../browser-Resizable-s-topleft.golden.json | 12 ++ ...owser-Resizable-se-bottomright.golden.json | 12 ++ .../browser-Resizable-se-topleft.golden.json | 12 ++ ...owser-Resizable-sw-bottomright.golden.json | 12 ++ .../browser-Resizable-sw-topleft.golden.json | 12 ++ ...rowser-Resizable-w-bottomright.golden.json | 12 ++ .../browser-Resizable-w-topleft.golden.json | 12 ++ ...ser-ResizableBox-e-bottomright.golden.json | 12 ++ ...browser-ResizableBox-e-topleft.golden.json | 12 ++ ...ser-ResizableBox-n-bottomright.golden.json | 12 ++ ...browser-ResizableBox-n-topleft.golden.json | 12 ++ ...er-ResizableBox-ne-bottomright.golden.json | 12 ++ ...rowser-ResizableBox-ne-topleft.golden.json | 12 ++ ...er-ResizableBox-nw-bottomright.golden.json | 12 ++ ...rowser-ResizableBox-nw-topleft.golden.json | 12 ++ ...ser-ResizableBox-s-bottomright.golden.json | 12 ++ ...browser-ResizableBox-s-topleft.golden.json | 12 ++ ...er-ResizableBox-se-bottomright.golden.json | 12 ++ ...rowser-ResizableBox-se-topleft.golden.json | 12 ++ ...er-ResizableBox-sw-bottomright.golden.json | 12 ++ ...rowser-ResizableBox-sw-topleft.golden.json | 12 ++ ...ser-ResizableBox-w-bottomright.golden.json | 12 ++ ...browser-ResizableBox-w-topleft.golden.json | 12 ++ .../browser-controlled-frozen.golden.json | 12 ++ .../browser-grid-relative-deltas.golden.json | 13 ++ .../browser-known-lock-axis-x.golden.json | 10 ++ .../browser-known-mouseup-delta.golden.json | 10 ++ .../browser-lock-max-binding.golden.json | 10 ++ .../browser-scale-0.5-nw.golden.json | 12 ++ .../browser-scale-0.5-se.golden.json | 12 ++ .../__golden__/browser-scale-2-nw.golden.json | 12 ++ .../__golden__/browser-scale-2-se.golden.json | 12 ++ .../__golden__/browser-strict-box.golden.json | 47 ++++++ .../cadence-B-stale-props-255.golden.json | 14 ++ .../callback-false-is-ignored.golden.json | 12 ++ .../__golden__/controlled-clamp.golden.json | 12 ++ .../__golden__/controlled-frozen.golden.json | 12 ++ .../__golden__/draggable-cancel.golden.json | 12 ++ .../__golden__/draggable-disabled.golden.json | 12 ++ .../draggable-double-scale.golden.json | 12 ++ .../draggable-handle-selector.golden.json | 12 ++ .../draggable-no-user-select.golden.json | 12 ++ .../grid-relative-deltas.golden.json | 13 ++ .../__golden__/handle-size-large.golden.json | 12 ++ .../__golden__/handle-size-small.golden.json | 12 ++ ...known-aspect-max-drift-batched.golden.json | 13 ++ .../known-aspect-max-drift.golden.json | 12 ++ .../__golden__/known-axis-none.golden.json | 12 ++ .../known-box-missing-width.golden.json | 12 ++ .../known-box-resize-after-stop.golden.json | 13 ++ ...draggable-handlers-overwritten.golden.json | 12 ++ .../known-element-ref-overwritten.golden.json | 12 ++ .../known-function-without-ref.golden.json | 12 ++ .../known-incompatible-axis.golden.json | 12 ++ .../__golden__/known-lock-axis-x.golden.json | 10 ++ .../known-lock-zero-height.golden.json | 12 ++ .../known-mouseup-delta.golden.json | 10 ++ .../__golden__/known-scale-zero.golden.json | 12 ++ .../known-start-constrained.golden.json | 11 ++ .../golden/__golden__/strict-box.golden.json | 47 ++++++ .../__golden__/strict-resizable.golden.json | 47 ++++++ .../touch-nw-moving-layout.golden.json | 12 ++ .../__golden__/unmount-mouse.golden.json | 13 ++ .../__golden__/unmount-touch.golden.json | 13 ++ __tests__/golden/expectGolden.ts | 16 ++ __tests__/golden/fixture.tsx | 69 +++++++++ __tests__/golden/harness.ts | 142 +++++++++++++++++ __tests__/golden/recorder.ts | 46 ++++++ __tests__/golden/scenarios.ts | 144 ++++++++++++++++++ .../scenarios/interactions.golden.test.tsx | 9 ++ __tests__/golden/serialize.ts | 17 +++ jest.config.js | 1 + package.json | 3 +- tsconfig.golden.json | 5 + 429 files changed, 7053 insertions(+), 1 deletion(-) create mode 100644 __tests__/golden/README.md create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-all-handles-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-false.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-true.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-false.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-true.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-false.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-true.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-false.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-true.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-false.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-true.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-constraints-unbounded-lock-false.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-constraints-unbounded-lock-true.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-e-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-n-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-ne-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-nw-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-0-0.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-0-1.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-0-2.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-0-3.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-1-0.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-1-1.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-1-2.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-1-3.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-2-0.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-2-1.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-2-2.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-2-3.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-3-0.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-3-1.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-3-2.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-options-3-3.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-s-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-se-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-sw-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/Resizable-w-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-false.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-true.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-false.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-true.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-false.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-true.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-false.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-true.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-false.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-true.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-false.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-true.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-e-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-n-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-ne-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-nw-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-0-0.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-0-1.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-0-2.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-0-3.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-1-0.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-1-1.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-1-2.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-1-3.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-2-0.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-2-1.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-2-2.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-2-3.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-3-0.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-3-1.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-3-2.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-options-3-3.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-s-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-se-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-sw-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-both-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-both-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-both-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-both-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-none-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-none-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-none-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-none-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-x-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-x-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-x-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-x-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-y-bottomright-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-y-bottomright-per-event.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-y-topleft-batched.golden.json create mode 100644 __tests__/golden/__golden__/ResizableBox-w-y-topleft-per-event.golden.json create mode 100644 __tests__/golden/__golden__/box-cadence-B-stale-props-255.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-e-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-e-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-n-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-n-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-ne-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-ne-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-nw-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-nw-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-s-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-s-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-se-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-se-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-sw-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-sw-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-w-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-Resizable-w-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-e-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-e-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-n-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-n-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-ne-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-ne-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-nw-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-nw-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-s-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-s-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-se-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-se-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-sw-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-sw-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-w-bottomright.golden.json create mode 100644 __tests__/golden/__golden__/browser-ResizableBox-w-topleft.golden.json create mode 100644 __tests__/golden/__golden__/browser-controlled-frozen.golden.json create mode 100644 __tests__/golden/__golden__/browser-grid-relative-deltas.golden.json create mode 100644 __tests__/golden/__golden__/browser-known-lock-axis-x.golden.json create mode 100644 __tests__/golden/__golden__/browser-known-mouseup-delta.golden.json create mode 100644 __tests__/golden/__golden__/browser-lock-max-binding.golden.json create mode 100644 __tests__/golden/__golden__/browser-scale-0.5-nw.golden.json create mode 100644 __tests__/golden/__golden__/browser-scale-0.5-se.golden.json create mode 100644 __tests__/golden/__golden__/browser-scale-2-nw.golden.json create mode 100644 __tests__/golden/__golden__/browser-scale-2-se.golden.json create mode 100644 __tests__/golden/__golden__/browser-strict-box.golden.json create mode 100644 __tests__/golden/__golden__/cadence-B-stale-props-255.golden.json create mode 100644 __tests__/golden/__golden__/callback-false-is-ignored.golden.json create mode 100644 __tests__/golden/__golden__/controlled-clamp.golden.json create mode 100644 __tests__/golden/__golden__/controlled-frozen.golden.json create mode 100644 __tests__/golden/__golden__/draggable-cancel.golden.json create mode 100644 __tests__/golden/__golden__/draggable-disabled.golden.json create mode 100644 __tests__/golden/__golden__/draggable-double-scale.golden.json create mode 100644 __tests__/golden/__golden__/draggable-handle-selector.golden.json create mode 100644 __tests__/golden/__golden__/draggable-no-user-select.golden.json create mode 100644 __tests__/golden/__golden__/grid-relative-deltas.golden.json create mode 100644 __tests__/golden/__golden__/handle-size-large.golden.json create mode 100644 __tests__/golden/__golden__/handle-size-small.golden.json create mode 100644 __tests__/golden/__golden__/known-aspect-max-drift-batched.golden.json create mode 100644 __tests__/golden/__golden__/known-aspect-max-drift.golden.json create mode 100644 __tests__/golden/__golden__/known-axis-none.golden.json create mode 100644 __tests__/golden/__golden__/known-box-missing-width.golden.json create mode 100644 __tests__/golden/__golden__/known-box-resize-after-stop.golden.json create mode 100644 __tests__/golden/__golden__/known-draggable-handlers-overwritten.golden.json create mode 100644 __tests__/golden/__golden__/known-element-ref-overwritten.golden.json create mode 100644 __tests__/golden/__golden__/known-function-without-ref.golden.json create mode 100644 __tests__/golden/__golden__/known-incompatible-axis.golden.json create mode 100644 __tests__/golden/__golden__/known-lock-axis-x.golden.json create mode 100644 __tests__/golden/__golden__/known-lock-zero-height.golden.json create mode 100644 __tests__/golden/__golden__/known-mouseup-delta.golden.json create mode 100644 __tests__/golden/__golden__/known-scale-zero.golden.json create mode 100644 __tests__/golden/__golden__/known-start-constrained.golden.json create mode 100644 __tests__/golden/__golden__/strict-box.golden.json create mode 100644 __tests__/golden/__golden__/strict-resizable.golden.json create mode 100644 __tests__/golden/__golden__/touch-nw-moving-layout.golden.json create mode 100644 __tests__/golden/__golden__/unmount-mouse.golden.json create mode 100644 __tests__/golden/__golden__/unmount-touch.golden.json create mode 100644 __tests__/golden/expectGolden.ts create mode 100644 __tests__/golden/fixture.tsx create mode 100644 __tests__/golden/harness.ts create mode 100644 __tests__/golden/recorder.ts create mode 100644 __tests__/golden/scenarios.ts create mode 100644 __tests__/golden/scenarios/interactions.golden.test.tsx create mode 100644 __tests__/golden/serialize.ts create mode 100644 tsconfig.golden.json diff --git a/__tests__/golden/README.md b/__tests__/golden/README.md new file mode 100644 index 00000000..f6575ec8 --- /dev/null +++ b/__tests__/golden/README.md @@ -0,0 +1,79 @@ +# Golden interaction traces + +These files freeze observable behavior before resize refactors. They include +known bugs. Explain every golden diff in the PR, including intentional changes +to layout-read counts. + +```text +scenarios.ts → harness.ts → real DraggableCore → recorder.ts + ↓ + __golden__/.golden.json +``` + +Run the suite with `corepack yarn test`. To regenerate committed traces, run: + +```sh +corepack yarn golden:update +``` + +Review the diff before committing. Normal runs fail for missing or changed files; +they never create fixtures. `GOLDEN_UPDATE=1` is the only write switch. The serializer +sorts object keys, keeps one step per line, and represents `undefined`, nonfinite +numbers, and negative zero with tagged JSON objects. Floats retain full precision. + +## What the traces pin + +| Boundary | Recorded evidence | +| --- | --- | +| Callback stream | Ordered start/resize/stop, exact sizes, axis, event type and synthetic/native kind | +| Node identity | Callback node equals the handle, stable IDs across re-renders | +| Rendering | Width/height styles after each event, handle axes/classes/order, child attributes | +| Layout work | Cumulative box/handle/other `getBoundingClientRect` call counts | +| Lifecycle | User-select class, explicit animation-frame cleanup, unmount, StrictMode | +| Broken inputs | Missing dimensions, nonfinite results, missing handle ref error | + +The matrix covers both components, every handle alone and all together, all axis +settings, both anchors, and both render cadences. Targeted combinations exercise +constraints and slack, aspect locking, transform scales, custom handles, mouse and +touch, controlled parents that follow/reject/clamp sizes, and draggable options. + +Each event in cadence A (`per-event`) has its own `act()`. Cadence B (`batched`) +uses one `act()` for the whole gesture, with a separate flush checkpoint. Native +DOM dispatch avoids Testing Library's implicit per-event wrapping. The separate +`native-burst` scenario deliberately dispatches outside `act()` and flushes after +release to expose ResizableBox's delayed user callbacks. + +The fake layout derives rects from inline dimensions. With `bottomright` +anchoring, growing the box moves its left/top and changes DraggableCore's +coordinates relative to the offset parent. This makes north/west correction +observable. The layout patch restores the original own property descriptors, +including the absence of a descriptor. It does not stub drag handlers. + +Animation frames drain at an explicit checkpoint so selection cleanup does not +depend on wall-clock timing. The recorder never reads layout itself. + +## Known bugs + +Named scenarios carry `"knownBug": ": "` in their metadata. +IDs refer to section 5 of the pre-refactor audit. Keep the marker while the broken +behavior is expected. A bug fix must explain its golden diff and remove or update +the marker in the same PR. + +| ID | Behavior | +| --- | --- | +| 5.1 | Binding max distorts the aspect ratio and subsequent projections drift | +| 5.2 | Aspect locking changes height with `axis="x"` | +| 5.3a/b/c | Missing width, zero height with lock, and zero scale produce nonfinite sizes | +| 5.4 | ResizableBox user `onResize` callbacks can commit after stop | +| 5.5 | Mouseup's final delta is dropped | +| 5.6 | Draggable callback options and nodeRef are overwritten | +| 5.7 | A function handle without its ref throws on mousedown | +| 5.8 | Start reports constrained dimensions before the DOM has that size | +| 5.9 | Disabled or incompatible axes suppress start/stop callbacks | +| 5.11 | An element handle's existing ref is overwritten | + +## Browser cross-check + +See [browser/README.md](browser/README.md). The browser subset uses real mouse +input and real CSS layout against `lib/` source, then compares shared observable +fields with the jsdom goldens. Browser tests run separately from Jest. diff --git a/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-batched.golden.json new file mode 100644 index 00000000..133f8325 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..9c7af729 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"170px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"180px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"260px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"270px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"290px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"310px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"350px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"360px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-batched.golden.json new file mode 100644 index 00000000..c0d17fb8 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-per-event.golden.json new file mode 100644 index 00000000..301f8abd --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"150px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"140px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"150px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"170px","tag":"div","width":"170px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"180px","tag":"div","width":"180px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"210px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"230px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"240px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"260px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"270px","tag":"div","width":"270px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-batched.golden.json new file mode 100644 index 00000000..8719995a --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..182113c6 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-batched.golden.json new file mode 100644 index 00000000..c0a44447 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-per-event.golden.json new file mode 100644 index 00000000..ed18ecfe --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-batched.golden.json new file mode 100644 index 00000000..ceecc405 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..6e5862d4 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-batched.golden.json new file mode 100644 index 00000000..d08dc05a --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-per-event.golden.json new file mode 100644 index 00000000..01238152 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"150px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"170px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"180px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"270px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-batched.golden.json new file mode 100644 index 00000000..317e2ca1 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..3aabc45c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"170px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"180px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"200px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"260px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"270px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"290px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"310px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"350px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"360px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-batched.golden.json new file mode 100644 index 00000000..2abd5e7f --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-per-event.golden.json new file mode 100644 index 00000000..0f4c57bf --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"140px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"150px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"170px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"180px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"200px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"210px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"230px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"240px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"260px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"270px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-false.golden.json b/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-false.golden.json new file mode 100644 index 00000000..3e7e049c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-false.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[120,115],"min":null,"mode":"follow","name":"Resizable-constraints-max-binding-return-lock-false","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-true.golden.json b/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-true.golden.json new file mode 100644 index 00000000..dddb9ba8 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-true.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":[120,115],"min":null,"mode":"follow","name":"Resizable-constraints-max-binding-return-lock-true","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":111.09502262443442,"width":108.53393665158374}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"111.09502262443442px","tag":"div","width":"108.53393665158374px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90.86455419266944,"width":88.76984346958983}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90.86455419266944,"width":88.76984346958983}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-false.golden.json b/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-false.golden.json new file mode 100644 index 00000000..29bcc629 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-false.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[1000,1000],"min":null,"mode":"follow","name":"Resizable-constraints-max-not-binding-lock-false","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-true.golden.json b/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-true.golden.json new file mode 100644 index 00000000..4b8a7849 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-true.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":[1000,1000],"min":null,"mode":"follow","name":"Resizable-constraints-max-not-binding-lock-true","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-false.golden.json b/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-false.golden.json new file mode 100644 index 00000000..f24c7e26 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-false.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":null,"min":[80,70],"mode":"follow","name":"Resizable-constraints-min-binding-return-lock-false","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":80,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"80px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-true.golden.json b/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-true.golden.json new file mode 100644 index 00000000..aae60d38 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-true.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":null,"min":[80,70],"mode":"follow","name":"Resizable-constraints-min-binding-return-lock-true","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":74.33628318584073,"width":84.9557522123894}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"74.33628318584073px","tag":"div","width":"84.9557522123894px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.21238938053101,"width":116.81415929203543}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.21238938053101,"width":116.81415929203543}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-false.golden.json b/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-false.golden.json new file mode 100644 index 00000000..cdf5031a --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-false.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":null,"min":[20,20],"mode":"follow","name":"Resizable-constraints-min-not-binding-lock-false","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-true.golden.json b/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-true.golden.json new file mode 100644 index 00000000..20d03cfd --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-true.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":null,"min":[20,20],"mode":"follow","name":"Resizable-constraints-min-not-binding-lock-true","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-false.golden.json b/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-false.golden.json new file mode 100644 index 00000000..655dea0c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-false.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[110,110],"min":[90,90],"mode":"follow","name":"Resizable-constraints-tight-min-max-lock-false","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-true.golden.json b/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-true.golden.json new file mode 100644 index 00000000..9fdbc190 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-true.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":[110,110],"min":[90,90],"mode":"follow","name":"Resizable-constraints-tight-min-max-lock-true","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-false.golden.json b/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-false.golden.json new file mode 100644 index 00000000..936b2bb2 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-false.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":null,"min":null,"mode":"follow","name":"Resizable-constraints-unbounded-lock-false","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-true.golden.json b/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-true.golden.json new file mode 100644 index 00000000..5c32d46c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-true.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":null,"min":null,"mode":"follow","name":"Resizable-constraints-unbounded-lock-true","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-both-bottomright-batched.golden.json new file mode 100644 index 00000000..25e41743 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..677a5062 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-both-topleft-batched.golden.json new file mode 100644 index 00000000..b98bcc01 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-both-topleft-per-event.golden.json new file mode 100644 index 00000000..b698c99e --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-none-bottomright-batched.golden.json new file mode 100644 index 00000000..b837da0a --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..db9622f7 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-none-topleft-batched.golden.json new file mode 100644 index 00000000..d6fb9ef8 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-none-topleft-per-event.golden.json new file mode 100644 index 00000000..571f934f --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-x-bottomright-batched.golden.json new file mode 100644 index 00000000..c2e7ce83 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..1b552617 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-x-topleft-batched.golden.json new file mode 100644 index 00000000..e13cd52a --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-x-topleft-per-event.golden.json new file mode 100644 index 00000000..f4da28c3 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-y-bottomright-batched.golden.json new file mode 100644 index 00000000..fb5ede20 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..0ef2eb03 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-y-topleft-batched.golden.json new file mode 100644 index 00000000..c77def28 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-y-topleft-per-event.golden.json new file mode 100644 index 00000000..188e45ef --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-e-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-both-bottomright-batched.golden.json new file mode 100644 index 00000000..8386ba8c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..47aee515 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-both-topleft-batched.golden.json new file mode 100644 index 00000000..566b505d --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-both-topleft-per-event.golden.json new file mode 100644 index 00000000..5e345d25 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-none-bottomright-batched.golden.json new file mode 100644 index 00000000..43fa9e63 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..74c5b85c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-none-topleft-batched.golden.json new file mode 100644 index 00000000..8f222474 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-none-topleft-per-event.golden.json new file mode 100644 index 00000000..3ae6545e --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-x-bottomright-batched.golden.json new file mode 100644 index 00000000..de1d0154 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..629aa09b --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-x-topleft-batched.golden.json new file mode 100644 index 00000000..449eef60 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-x-topleft-per-event.golden.json new file mode 100644 index 00000000..4088624f --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-y-bottomright-batched.golden.json new file mode 100644 index 00000000..eeeaf9da --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..61851860 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-y-topleft-batched.golden.json new file mode 100644 index 00000000..5ca2c5d0 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-y-topleft-per-event.golden.json new file mode 100644 index 00000000..ada07839 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-n-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-both-bottomright-batched.golden.json new file mode 100644 index 00000000..b97a0069 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..94f8f9fd --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-both-topleft-batched.golden.json new file mode 100644 index 00000000..dcca0a6f --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-both-topleft-per-event.golden.json new file mode 100644 index 00000000..cf72f775 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-none-bottomright-batched.golden.json new file mode 100644 index 00000000..53f55fc6 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..b89ec547 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-none-topleft-batched.golden.json new file mode 100644 index 00000000..faf271b8 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-none-topleft-per-event.golden.json new file mode 100644 index 00000000..b7baf69c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-x-bottomright-batched.golden.json new file mode 100644 index 00000000..73206568 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..5f3d96a9 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-x-topleft-batched.golden.json new file mode 100644 index 00000000..92284246 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-x-topleft-per-event.golden.json new file mode 100644 index 00000000..6827dae7 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-y-bottomright-batched.golden.json new file mode 100644 index 00000000..f01b291e --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..ff475581 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-y-topleft-batched.golden.json new file mode 100644 index 00000000..7ff5c6de --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-y-topleft-per-event.golden.json new file mode 100644 index 00000000..43f64c94 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-ne-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-both-bottomright-batched.golden.json new file mode 100644 index 00000000..dc5d9f0d --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..62cfbbd7 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-both-topleft-batched.golden.json new file mode 100644 index 00000000..6fb97d27 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-both-topleft-per-event.golden.json new file mode 100644 index 00000000..c710b4f4 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-none-bottomright-batched.golden.json new file mode 100644 index 00000000..89c1df86 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..a6dfaae6 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-none-topleft-batched.golden.json new file mode 100644 index 00000000..d86c6e8a --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-none-topleft-per-event.golden.json new file mode 100644 index 00000000..254a7933 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-x-bottomright-batched.golden.json new file mode 100644 index 00000000..07c27208 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..a6ee4768 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-x-topleft-batched.golden.json new file mode 100644 index 00000000..82b01d25 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-x-topleft-per-event.golden.json new file mode 100644 index 00000000..bd176197 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-y-bottomright-batched.golden.json new file mode 100644 index 00000000..946e169b --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..21fdc17d --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-y-topleft-batched.golden.json new file mode 100644 index 00000000..d1e0af54 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-y-topleft-per-event.golden.json new file mode 100644 index 00000000..06ff79c2 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-nw-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-0-0.golden.json b/__tests__/golden/__golden__/Resizable-options-0-0.golden.json new file mode 100644 index 00000000..2014aad3 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-0-0.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":true,"max":null,"min":null,"mode":"follow","name":"Resizable-options-0-0","opts":{},"pointer":"touch","points":[[10,10],[20,20],[30,30]],"scale":0.5,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-0-1.golden.json b/__tests__/golden/__golden__/Resizable-options-0-1.golden.json new file mode 100644 index 00000000..104abd2a --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-0-1.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":null,"min":[80,70],"mode":"frozen","name":"Resizable-options-0-1","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-0-2.golden.json b/__tests__/golden/__golden__/Resizable-options-0-2.golden.json new file mode 100644 index 00000000..f16f84b4 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-0-2.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":true,"max":[120,115],"min":[80,70],"mode":"clamp","name":"Resizable-options-0-2","opts":{},"pointer":"touch","points":[[10,10],[20,20],[30,30]],"scale":2,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-0-3.golden.json b/__tests__/golden/__golden__/Resizable-options-0-3.golden.json new file mode 100644 index 00000000..fa6372af --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-0-3.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[120,115],"min":[80,70],"mode":"follow","name":"Resizable-options-0-3","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":115,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-1-0.golden.json b/__tests__/golden/__golden__/Resizable-options-1-0.golden.json new file mode 100644 index 00000000..c1b57cbe --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-1-0.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"element","lock":false,"max":null,"min":[80,70],"mode":"follow","name":"Resizable-options-1-0","opts":{},"pointer":"touch","points":[[10,5],[10,5],[0,0]],"scale":0.5,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-1-1.golden.json b/__tests__/golden/__golden__/Resizable-options-1-1.golden.json new file mode 100644 index 00000000..5e9df2c3 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-1-1.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"element","lock":true,"max":[120,115],"min":[80,70],"mode":"frozen","name":"Resizable-options-1-1","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-1-2.golden.json b/__tests__/golden/__golden__/Resizable-options-1-2.golden.json new file mode 100644 index 00000000..6a3ff221 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-1-2.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"element","lock":false,"max":[120,115],"min":[80,70],"mode":"clamp","name":"Resizable-options-1-2","opts":{},"pointer":"touch","points":[[10,5],[10,5],[0,0]],"scale":2,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.5,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"105px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-1-3.golden.json b/__tests__/golden/__golden__/Resizable-options-1-3.golden.json new file mode 100644 index 00000000..d1608346 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-1-3.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"element","lock":true,"max":null,"min":null,"mode":"follow","name":"Resizable-options-1-3","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-2-0.golden.json b/__tests__/golden/__golden__/Resizable-options-2-0.golden.json new file mode 100644 index 00000000..49cab646 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-2-0.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"fn","lock":true,"max":[120,115],"min":[80,70],"mode":"follow","name":"Resizable-options-2-0","opts":{},"pointer":"touch","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":0.5,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":95.39823008849561,"width":109.02654867256638}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":95.39823008849561,"width":109.02654867256638}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-2-1.golden.json b/__tests__/golden/__golden__/Resizable-options-2-1.golden.json new file mode 100644 index 00000000..404eb56e --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-2-1.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"fn","lock":false,"max":[120,115],"min":[80,70],"mode":"frozen","name":"Resizable-options-2-1","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-2-2.golden.json b/__tests__/golden/__golden__/Resizable-options-2-2.golden.json new file mode 100644 index 00000000..3dcec09b --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-2-2.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"fn","lock":true,"max":null,"min":null,"mode":"clamp","name":"Resizable-options-2-2","opts":{},"pointer":"touch","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":2,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":75,"width":75}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"75px","tag":"div","width":"75px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":85,"width":85}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"85px","tag":"div","width":"85px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":95,"width":95}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"95px","tag":"div","width":"95px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-2-3.golden.json b/__tests__/golden/__golden__/Resizable-options-2-3.golden.json new file mode 100644 index 00000000..c7fe7deb --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-2-3.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"fn","lock":false,"max":null,"min":[80,70],"mode":"follow","name":"Resizable-options-2-3","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":80,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"80px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":70,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":70,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-3-0.golden.json b/__tests__/golden/__golden__/Resizable-options-3-0.golden.json new file mode 100644 index 00000000..3fff4bce --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-3-0.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"component","lock":false,"max":[120,115],"min":[80,70],"mode":"follow","name":"Resizable-options-3-0","opts":{},"pointer":"touch","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":0.5,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":115,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":95,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":95,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-3-1.golden.json b/__tests__/golden/__golden__/Resizable-options-3-1.golden.json new file mode 100644 index 00000000..af7ce7b5 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-3-1.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"component","lock":true,"max":null,"min":null,"mode":"frozen","name":"Resizable-options-3-1","opts":{},"pointer":"mouse","points":[[10,5],[10,5],[0,0]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":92.5,"width":92.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-3-2.golden.json b/__tests__/golden/__golden__/Resizable-options-3-2.golden.json new file mode 100644 index 00000000..a68c9482 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-3-2.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"component","lock":false,"max":null,"min":[80,70],"mode":"clamp","name":"Resizable-options-3-2","opts":{},"pointer":"touch","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":2,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":135}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-3-3.golden.json b/__tests__/golden/__golden__/Resizable-options-3-3.golden.json new file mode 100644 index 00000000..2b739e1c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-options-3-3.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"component","lock":true,"max":[120,115],"min":[80,70],"mode":"follow","name":"Resizable-options-3-3","opts":{},"pointer":"mouse","points":[[10,5],[10,5],[0,0]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":103.75,"width":103.75}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"103.75px","tag":"div","width":"103.75px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":101.875,"width":101.875}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":101.875,"width":101.875}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-both-bottomright-batched.golden.json new file mode 100644 index 00000000..3db0209e --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..8496494b --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-both-topleft-batched.golden.json new file mode 100644 index 00000000..99691dd3 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-both-topleft-per-event.golden.json new file mode 100644 index 00000000..b63147a6 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-none-bottomright-batched.golden.json new file mode 100644 index 00000000..4808dc1b --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..6e6ea49e --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-none-topleft-batched.golden.json new file mode 100644 index 00000000..5b84e34e --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-none-topleft-per-event.golden.json new file mode 100644 index 00000000..80b50fd7 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-x-bottomright-batched.golden.json new file mode 100644 index 00000000..97d99a80 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..5a8ce57c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-x-topleft-batched.golden.json new file mode 100644 index 00000000..29654592 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-x-topleft-per-event.golden.json new file mode 100644 index 00000000..2e9016c7 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-y-bottomright-batched.golden.json new file mode 100644 index 00000000..2554d483 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..ae9df547 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-y-topleft-batched.golden.json new file mode 100644 index 00000000..bdd6cb28 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-y-topleft-per-event.golden.json new file mode 100644 index 00000000..79aa9c4c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-s-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-both-bottomright-batched.golden.json new file mode 100644 index 00000000..f604254c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..4f9748ee --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-both-topleft-batched.golden.json new file mode 100644 index 00000000..c37763c3 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-both-topleft-per-event.golden.json new file mode 100644 index 00000000..34521522 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-none-bottomright-batched.golden.json new file mode 100644 index 00000000..ef21e608 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..6d2e77e6 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-none-topleft-batched.golden.json new file mode 100644 index 00000000..fd03c28c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-none-topleft-per-event.golden.json new file mode 100644 index 00000000..0c2d917f --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-x-bottomright-batched.golden.json new file mode 100644 index 00000000..4ef042cf --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..2ea42c54 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-x-topleft-batched.golden.json new file mode 100644 index 00000000..056f691b --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-x-topleft-per-event.golden.json new file mode 100644 index 00000000..bc6afd69 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-y-bottomright-batched.golden.json new file mode 100644 index 00000000..0e6348e9 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..703ae23d --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-y-topleft-batched.golden.json new file mode 100644 index 00000000..9150cbee --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-y-topleft-per-event.golden.json new file mode 100644 index 00000000..7b901262 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-se-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-both-bottomright-batched.golden.json new file mode 100644 index 00000000..6bf9a6d3 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..34086147 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-both-topleft-batched.golden.json new file mode 100644 index 00000000..fd2f6a43 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-both-topleft-per-event.golden.json new file mode 100644 index 00000000..696c566c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-none-bottomright-batched.golden.json new file mode 100644 index 00000000..1bbb7d8c --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..10174fe8 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-none-topleft-batched.golden.json new file mode 100644 index 00000000..d404635f --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-none-topleft-per-event.golden.json new file mode 100644 index 00000000..638462fa --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-x-bottomright-batched.golden.json new file mode 100644 index 00000000..a968d337 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..40f8bf8d --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-x-topleft-batched.golden.json new file mode 100644 index 00000000..9ab54c91 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-x-topleft-per-event.golden.json new file mode 100644 index 00000000..ed0e00ab --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-y-bottomright-batched.golden.json new file mode 100644 index 00000000..a4180c3a --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..8b712820 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-y-topleft-batched.golden.json new file mode 100644 index 00000000..750aeeb4 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-y-topleft-per-event.golden.json new file mode 100644 index 00000000..a595fc0a --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-sw-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-both-bottomright-batched.golden.json new file mode 100644 index 00000000..7f23f9cb --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..6dda75bc --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-both-topleft-batched.golden.json new file mode 100644 index 00000000..556d4e85 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-both-topleft-per-event.golden.json new file mode 100644 index 00000000..262a0fc3 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-none-bottomright-batched.golden.json new file mode 100644 index 00000000..2d932922 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..be991349 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-none-topleft-batched.golden.json new file mode 100644 index 00000000..54cf779a --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-none-topleft-per-event.golden.json new file mode 100644 index 00000000..cd38af7f --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-x-bottomright-batched.golden.json new file mode 100644 index 00000000..3f22c5d0 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..df6dc6b3 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-x-topleft-batched.golden.json new file mode 100644 index 00000000..e62b97c1 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-x-topleft-per-event.golden.json new file mode 100644 index 00000000..3aa6b34e --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-y-bottomright-batched.golden.json new file mode 100644 index 00000000..1efabb4b --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..cf176147 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-y-topleft-batched.golden.json new file mode 100644 index 00000000..fa9e78d5 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-y-topleft-per-event.golden.json new file mode 100644 index 00000000..8170ca36 --- /dev/null +++ b/__tests__/golden/__golden__/Resizable-w-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-batched.golden.json new file mode 100644 index 00000000..89a3e793 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..2db785ce --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"170px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"180px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"260px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"270px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"290px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"310px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"350px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"360px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-batched.golden.json new file mode 100644 index 00000000..e7302127 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-per-event.golden.json new file mode 100644 index 00000000..bb7f77a7 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"150px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"140px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"150px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"170px","tag":"div","width":"170px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"180px","tag":"div","width":"180px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"210px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"230px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"240px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"260px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"270px","tag":"div","width":"270px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-batched.golden.json new file mode 100644 index 00000000..edd56f89 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..c0007d1b --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-batched.golden.json new file mode 100644 index 00000000..70745e3c --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-per-event.golden.json new file mode 100644 index 00000000..c16d466f --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-batched.golden.json new file mode 100644 index 00000000..61a12160 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..9bf2b2a4 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-batched.golden.json new file mode 100644 index 00000000..25ecd012 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-per-event.golden.json new file mode 100644 index 00000000..0c44f381 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"150px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"170px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"180px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"270px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-batched.golden.json new file mode 100644 index 00000000..26871b49 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..76ac9154 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"170px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"180px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"200px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"260px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"270px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"290px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"310px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"350px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"360px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-batched.golden.json new file mode 100644 index 00000000..0b875e13 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-batched.golden.json @@ -0,0 +1,55 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-per-event.golden.json new file mode 100644 index 00000000..cfff049e --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-per-event.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"140px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"150px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"170px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"180px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"200px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"210px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"230px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"240px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"260px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"270px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-false.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-false.golden.json new file mode 100644 index 00000000..0e058eb7 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-false.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[120,115],"min":null,"mode":"follow","name":"ResizableBox-constraints-max-binding-return-lock-false","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-true.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-true.golden.json new file mode 100644 index 00000000..a8a1e616 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-true.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":[120,115],"min":null,"mode":"follow","name":"ResizableBox-constraints-max-binding-return-lock-true","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":111.09502262443442,"width":108.53393665158374}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"111.09502262443442px","tag":"div","width":"108.53393665158374px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90.86455419266944,"width":88.76984346958983}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90.86455419266944,"width":88.76984346958983}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-false.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-false.golden.json new file mode 100644 index 00000000..4482865c --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-false.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[1000,1000],"min":null,"mode":"follow","name":"ResizableBox-constraints-max-not-binding-lock-false","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-true.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-true.golden.json new file mode 100644 index 00000000..95070b68 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-true.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":[1000,1000],"min":null,"mode":"follow","name":"ResizableBox-constraints-max-not-binding-lock-true","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-false.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-false.golden.json new file mode 100644 index 00000000..cc03eb6b --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-false.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":null,"min":[80,70],"mode":"follow","name":"ResizableBox-constraints-min-binding-return-lock-false","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":80,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"80px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-true.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-true.golden.json new file mode 100644 index 00000000..b9aad894 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-true.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":null,"min":[80,70],"mode":"follow","name":"ResizableBox-constraints-min-binding-return-lock-true","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":74.33628318584073,"width":84.9557522123894}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"74.33628318584073px","tag":"div","width":"84.9557522123894px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.21238938053101,"width":116.81415929203543}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.21238938053101,"width":116.81415929203543}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-false.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-false.golden.json new file mode 100644 index 00000000..0fbe215a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-false.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":null,"min":[20,20],"mode":"follow","name":"ResizableBox-constraints-min-not-binding-lock-false","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-true.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-true.golden.json new file mode 100644 index 00000000..191224d8 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-true.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":null,"min":[20,20],"mode":"follow","name":"ResizableBox-constraints-min-not-binding-lock-true","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-false.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-false.golden.json new file mode 100644 index 00000000..2ca9a0a0 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-false.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[110,110],"min":[90,90],"mode":"follow","name":"ResizableBox-constraints-tight-min-max-lock-false","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-true.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-true.golden.json new file mode 100644 index 00000000..1ad063a3 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-true.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":[110,110],"min":[90,90],"mode":"follow","name":"ResizableBox-constraints-tight-min-max-lock-true","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-false.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-false.golden.json new file mode 100644 index 00000000..c4830034 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-false.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":null,"min":null,"mode":"follow","name":"ResizableBox-constraints-unbounded-lock-false","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-true.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-true.golden.json new file mode 100644 index 00000000..d5639f3d --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-true.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":null,"min":null,"mode":"follow","name":"ResizableBox-constraints-unbounded-lock-true","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-batched.golden.json new file mode 100644 index 00000000..f85bf5f3 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..67f4c529 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-both-topleft-batched.golden.json new file mode 100644 index 00000000..54311006 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-both-topleft-per-event.golden.json new file mode 100644 index 00000000..ebd7276d --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-batched.golden.json new file mode 100644 index 00000000..d97a0715 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..74ce4a7a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-none-topleft-batched.golden.json new file mode 100644 index 00000000..0b5b621c --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-none-topleft-per-event.golden.json new file mode 100644 index 00000000..3fa522e5 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-batched.golden.json new file mode 100644 index 00000000..6781859d --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..2f9377f8 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-x-topleft-batched.golden.json new file mode 100644 index 00000000..0423b987 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-x-topleft-per-event.golden.json new file mode 100644 index 00000000..c32b6f52 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-batched.golden.json new file mode 100644 index 00000000..8dd25fee --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..65c5ad2b --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-y-topleft-batched.golden.json new file mode 100644 index 00000000..79ea3833 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-y-topleft-per-event.golden.json new file mode 100644 index 00000000..7f00c9f3 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-e-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-batched.golden.json new file mode 100644 index 00000000..5f52c585 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..0da53d2a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-both-topleft-batched.golden.json new file mode 100644 index 00000000..aabf68f4 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-both-topleft-per-event.golden.json new file mode 100644 index 00000000..082ca189 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-batched.golden.json new file mode 100644 index 00000000..3611e0fb --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..bf8d051b --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-none-topleft-batched.golden.json new file mode 100644 index 00000000..30ff71dd --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-none-topleft-per-event.golden.json new file mode 100644 index 00000000..d1655bec --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-batched.golden.json new file mode 100644 index 00000000..e612b1e3 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..ecbeca24 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-x-topleft-batched.golden.json new file mode 100644 index 00000000..43d5d27b --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-x-topleft-per-event.golden.json new file mode 100644 index 00000000..f663de9f --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-batched.golden.json new file mode 100644 index 00000000..387dece6 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..7d28ceed --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-y-topleft-batched.golden.json new file mode 100644 index 00000000..28b7f3f5 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-y-topleft-per-event.golden.json new file mode 100644 index 00000000..7373cbc1 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-n-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-batched.golden.json new file mode 100644 index 00000000..7ecf9a65 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..0b9eea50 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-batched.golden.json new file mode 100644 index 00000000..2bc9f2d7 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-per-event.golden.json new file mode 100644 index 00000000..e7598c9a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-batched.golden.json new file mode 100644 index 00000000..1cefbb66 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..58c2de52 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-batched.golden.json new file mode 100644 index 00000000..6470865a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-per-event.golden.json new file mode 100644 index 00000000..e2e0639a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-batched.golden.json new file mode 100644 index 00000000..c9daf435 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..1cb14b6a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-batched.golden.json new file mode 100644 index 00000000..a21ac7f2 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-per-event.golden.json new file mode 100644 index 00000000..d5adc006 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-batched.golden.json new file mode 100644 index 00000000..837605bc --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..9f67c973 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-batched.golden.json new file mode 100644 index 00000000..1ebaabe9 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-per-event.golden.json new file mode 100644 index 00000000..84386f6d --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-batched.golden.json new file mode 100644 index 00000000..12ef657b --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..19bd0487 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-batched.golden.json new file mode 100644 index 00000000..4ca30593 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-per-event.golden.json new file mode 100644 index 00000000..59e8d6ca --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-batched.golden.json new file mode 100644 index 00000000..62242785 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..b7a65e95 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-batched.golden.json new file mode 100644 index 00000000..aea3ac2a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-per-event.golden.json new file mode 100644 index 00000000..66700131 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-batched.golden.json new file mode 100644 index 00000000..9c1c2510 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..f54ee345 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-batched.golden.json new file mode 100644 index 00000000..366c4850 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-per-event.golden.json new file mode 100644 index 00000000..9bd08d1c --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-batched.golden.json new file mode 100644 index 00000000..55479e9f --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..743b7a9d --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-batched.golden.json new file mode 100644 index 00000000..a44f8db5 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-per-event.golden.json new file mode 100644 index 00000000..08035048 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-0-0.golden.json b/__tests__/golden/__golden__/ResizableBox-options-0-0.golden.json new file mode 100644 index 00000000..e3b69e4c --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-0-0.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":true,"max":null,"min":null,"mode":"follow","name":"ResizableBox-options-0-0","opts":{},"pointer":"touch","points":[[10,10],[20,20],[30,30]],"scale":0.5,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-0-1.golden.json b/__tests__/golden/__golden__/ResizableBox-options-0-1.golden.json new file mode 100644 index 00000000..3f427d84 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-0-1.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":null,"min":[80,70],"mode":"frozen","name":"ResizableBox-options-0-1","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"200px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"90px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"90px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"90px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"90px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-0-2.golden.json b/__tests__/golden/__golden__/ResizableBox-options-0-2.golden.json new file mode 100644 index 00000000..bc576845 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-0-2.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":true,"max":[120,115],"min":[80,70],"mode":"clamp","name":"ResizableBox-options-0-2","opts":{},"pointer":"touch","points":[[10,10],[20,20],[30,30]],"scale":2,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-0-3.golden.json b/__tests__/golden/__golden__/ResizableBox-options-0-3.golden.json new file mode 100644 index 00000000..7cf4eac9 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-0-3.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[120,115],"min":[80,70],"mode":"follow","name":"ResizableBox-options-0-3","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":115,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"115px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"115px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"115px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-1-0.golden.json b/__tests__/golden/__golden__/ResizableBox-options-1-0.golden.json new file mode 100644 index 00000000..29614cb5 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-1-0.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"element","lock":false,"max":null,"min":[80,70],"mode":"follow","name":"ResizableBox-options-1-0","opts":{},"pointer":"touch","points":[[10,5],[10,5],[0,0]],"scale":0.5,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-1-1.golden.json b/__tests__/golden/__golden__/ResizableBox-options-1-1.golden.json new file mode 100644 index 00000000..1d3b98e9 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-1-1.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"element","lock":true,"max":[120,115],"min":[80,70],"mode":"frozen","name":"ResizableBox-options-1-1","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":86.37168141592925,"width":94.42477876106199}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"86.37168141592925px","tag":"div","width":"94.42477876106199px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":105.44299675045976,"width":115.2742597671522}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"105.44299675045976px","tag":"div","width":"115.2742597671522px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":105.44299675045976,"width":115.2742597671522}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"105.44299675045976px","tag":"div","width":"115.2742597671522px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"105.44299675045976px","tag":"div","width":"115.2742597671522px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"105.44299675045976px","tag":"div","width":"115.2742597671522px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-1-2.golden.json b/__tests__/golden/__golden__/ResizableBox-options-1-2.golden.json new file mode 100644 index 00000000..a0464ea3 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-1-2.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"element","lock":false,"max":[120,115],"min":[80,70],"mode":"clamp","name":"ResizableBox-options-1-2","opts":{},"pointer":"touch","points":[[10,5],[10,5],[0,0]],"scale":2,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.5,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"105px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-1-3.golden.json b/__tests__/golden/__golden__/ResizableBox-options-1-3.golden.json new file mode 100644 index 00000000..a87e9bd6 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-1-3.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"element","lock":true,"max":null,"min":null,"mode":"follow","name":"ResizableBox-options-1-3","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-2-0.golden.json b/__tests__/golden/__golden__/ResizableBox-options-2-0.golden.json new file mode 100644 index 00000000..c399b3a0 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-2-0.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"fn","lock":true,"max":[120,115],"min":[80,70],"mode":"follow","name":"ResizableBox-options-2-0","opts":{},"pointer":"touch","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":0.5,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":95.39823008849561,"width":109.02654867256638}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":95.39823008849561,"width":109.02654867256638}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-2-1.golden.json b/__tests__/golden/__golden__/ResizableBox-options-2-1.golden.json new file mode 100644 index 00000000..1f286e1e --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-2-1.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"fn","lock":false,"max":[120,115],"min":[80,70],"mode":"frozen","name":"ResizableBox-options-2-1","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"90px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"80px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"80px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"80px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"80px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"80px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-2-2.golden.json b/__tests__/golden/__golden__/ResizableBox-options-2-2.golden.json new file mode 100644 index 00000000..656a6351 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-2-2.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"fn","lock":true,"max":null,"min":null,"mode":"clamp","name":"ResizableBox-options-2-2","opts":{},"pointer":"touch","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":2,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":75,"width":75}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"75px","tag":"div","width":"75px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":85,"width":85}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"85px","tag":"div","width":"85px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":95,"width":95}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"95px","tag":"div","width":"95px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-2-3.golden.json b/__tests__/golden/__golden__/ResizableBox-options-2-3.golden.json new file mode 100644 index 00000000..3a0082ab --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-2-3.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"fn","lock":false,"max":null,"min":[80,70],"mode":"follow","name":"ResizableBox-options-2-3","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":80,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"80px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":70,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":70,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-3-0.golden.json b/__tests__/golden/__golden__/ResizableBox-options-3-0.golden.json new file mode 100644 index 00000000..85cb4efd --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-3-0.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"component","lock":false,"max":[120,115],"min":[80,70],"mode":"follow","name":"ResizableBox-options-3-0","opts":{},"pointer":"touch","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":0.5,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":115,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"115px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"115px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"115px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":95,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":95,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-3-1.golden.json b/__tests__/golden/__golden__/ResizableBox-options-3-1.golden.json new file mode 100644 index 00000000..a340ae9a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-3-1.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"component","lock":true,"max":null,"min":null,"mode":"frozen","name":"ResizableBox-options-3-1","opts":{},"pointer":"mouse","points":[[10,5],[10,5],[0,0]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":92.5,"width":92.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"92.5px","tag":"div","width":"92.5px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"92.5px","tag":"div","width":"92.5px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-3-2.golden.json b/__tests__/golden/__golden__/ResizableBox-options-3-2.golden.json new file mode 100644 index 00000000..1290dd08 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-3-2.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"component","lock":false,"max":null,"min":[80,70],"mode":"clamp","name":"ResizableBox-options-3-2","opts":{},"pointer":"touch","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":2,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"140px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":145,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"145px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":150,"width":165}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"150px","tag":"div","width":"165px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":145,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"145px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":145,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"145px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"145px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"145px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-3-3.golden.json b/__tests__/golden/__golden__/ResizableBox-options-3-3.golden.json new file mode 100644 index 00000000..484987c3 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-options-3-3.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"component","lock":true,"max":[120,115],"min":[80,70],"mode":"follow","name":"ResizableBox-options-3-3","opts":{},"pointer":"mouse","points":[[10,5],[10,5],[0,0]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":103.75,"width":103.75}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"103.75px","tag":"div","width":"103.75px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":101.875,"width":101.875}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":101.875,"width":101.875}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-batched.golden.json new file mode 100644 index 00000000..5cf6a5ac --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..a5c1c66c --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-both-topleft-batched.golden.json new file mode 100644 index 00000000..6a7c0795 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-both-topleft-per-event.golden.json new file mode 100644 index 00000000..de3a8628 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-batched.golden.json new file mode 100644 index 00000000..ddd9b6c9 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..d96af63d --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-none-topleft-batched.golden.json new file mode 100644 index 00000000..0d9b60b4 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-none-topleft-per-event.golden.json new file mode 100644 index 00000000..67b33f37 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-batched.golden.json new file mode 100644 index 00000000..4ce46af9 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..09840405 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-x-topleft-batched.golden.json new file mode 100644 index 00000000..22638476 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-x-topleft-per-event.golden.json new file mode 100644 index 00000000..bc3c714a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-batched.golden.json new file mode 100644 index 00000000..1e37905a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..2bb0cf23 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-y-topleft-batched.golden.json new file mode 100644 index 00000000..f0082823 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-y-topleft-per-event.golden.json new file mode 100644 index 00000000..70848bce --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-s-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-batched.golden.json new file mode 100644 index 00000000..ff3925df --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..935349cf --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-both-topleft-batched.golden.json new file mode 100644 index 00000000..7f14fea2 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-both-topleft-per-event.golden.json new file mode 100644 index 00000000..6f0ee304 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-batched.golden.json new file mode 100644 index 00000000..2cb683f3 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..1c608fe1 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-none-topleft-batched.golden.json new file mode 100644 index 00000000..bac82e13 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-none-topleft-per-event.golden.json new file mode 100644 index 00000000..c2412f6e --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-batched.golden.json new file mode 100644 index 00000000..1739ce7b --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..a143c02f --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-x-topleft-batched.golden.json new file mode 100644 index 00000000..263abd75 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-x-topleft-per-event.golden.json new file mode 100644 index 00000000..562a61f9 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-batched.golden.json new file mode 100644 index 00000000..49c25fe8 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..2321fa5b --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-y-topleft-batched.golden.json new file mode 100644 index 00000000..533e49bc --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-y-topleft-per-event.golden.json new file mode 100644 index 00000000..3a5b9928 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-se-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-batched.golden.json new file mode 100644 index 00000000..ab424dfe --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..485a1de6 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-batched.golden.json new file mode 100644 index 00000000..5c043020 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-per-event.golden.json new file mode 100644 index 00000000..4ce8cd72 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-batched.golden.json new file mode 100644 index 00000000..f3426342 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..95533182 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-batched.golden.json new file mode 100644 index 00000000..361ac450 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-per-event.golden.json new file mode 100644 index 00000000..6ec20e82 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-batched.golden.json new file mode 100644 index 00000000..bf074602 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..a4fa26a7 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-batched.golden.json new file mode 100644 index 00000000..5b2e8d50 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-per-event.golden.json new file mode 100644 index 00000000..53ded335 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-batched.golden.json new file mode 100644 index 00000000..bf0ca575 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..07f9bd0e --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-batched.golden.json new file mode 100644 index 00000000..c773ef1a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-per-event.golden.json new file mode 100644 index 00000000..a50f916d --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-batched.golden.json new file mode 100644 index 00000000..dc4a7606 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-per-event.golden.json new file mode 100644 index 00000000..2d64334f --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-both-topleft-batched.golden.json new file mode 100644 index 00000000..3608005f --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-both-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-both-topleft-per-event.golden.json new file mode 100644 index 00000000..aeecf19a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-both-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-batched.golden.json new file mode 100644 index 00000000..f6cea6f6 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-per-event.golden.json new file mode 100644 index 00000000..8428a63a --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-none-topleft-batched.golden.json new file mode 100644 index 00000000..93af366d --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-none-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-none-topleft-per-event.golden.json new file mode 100644 index 00000000..e08a2902 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-none-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-batched.golden.json new file mode 100644 index 00000000..0d876a72 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-per-event.golden.json new file mode 100644 index 00000000..e3fd4a1c --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-x-topleft-batched.golden.json new file mode 100644 index 00000000..95066736 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-x-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-x-topleft-per-event.golden.json new file mode 100644 index 00000000..776fb792 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-x-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-batched.golden.json new file mode 100644 index 00000000..2f0d1492 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-per-event.golden.json new file mode 100644 index 00000000..3a44e9ac --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-y-topleft-batched.golden.json new file mode 100644 index 00000000..b972a887 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-y-topleft-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-y-topleft-per-event.golden.json new file mode 100644 index 00000000..f83f37f9 --- /dev/null +++ b/__tests__/golden/__golden__/ResizableBox-w-y-topleft-per-event.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/box-cadence-B-stale-props-255.golden.json b/__tests__/golden/__golden__/box-cadence-B-stale-props-255.golden.json new file mode 100644 index 00000000..292f24d1 --- /dev/null +++ b/__tests__/golden/__golden__/box-cadence-B-stale-props-255.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"box-cadence-B-stale-props-255","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-e-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-e-bottomright.golden.json new file mode 100644 index 00000000..208fe376 --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-e-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-e-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-e-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-e-topleft.golden.json new file mode 100644 index 00000000..4a926266 --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-e-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-e-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-n-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-n-bottomright.golden.json new file mode 100644 index 00000000..f88bc96e --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-n-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-n-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-n-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-n-topleft.golden.json new file mode 100644 index 00000000..04c5f81a --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-n-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-n-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-ne-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-ne-bottomright.golden.json new file mode 100644 index 00000000..8af6f364 --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-ne-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-ne-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-ne-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-ne-topleft.golden.json new file mode 100644 index 00000000..47ef8f90 --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-ne-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-ne-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-nw-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-nw-bottomright.golden.json new file mode 100644 index 00000000..2c7578bf --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-nw-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-nw-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-nw-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-nw-topleft.golden.json new file mode 100644 index 00000000..1293380a --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-nw-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-nw-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-s-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-s-bottomright.golden.json new file mode 100644 index 00000000..4cb465de --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-s-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-s-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-s-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-s-topleft.golden.json new file mode 100644 index 00000000..adaa04d6 --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-s-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-s-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-se-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-se-bottomright.golden.json new file mode 100644 index 00000000..8417cde3 --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-se-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-se-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-se-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-se-topleft.golden.json new file mode 100644 index 00000000..4926f166 --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-se-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-se-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-sw-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-sw-bottomright.golden.json new file mode 100644 index 00000000..1b2fcdca --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-sw-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-sw-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-sw-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-sw-topleft.golden.json new file mode 100644 index 00000000..a395f44a --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-sw-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-sw-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-w-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-w-bottomright.golden.json new file mode 100644 index 00000000..0035de71 --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-w-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-w-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-w-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-w-topleft.golden.json new file mode 100644 index 00000000..a27daea3 --- /dev/null +++ b/__tests__/golden/__golden__/browser-Resizable-w-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-w-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-e-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-e-bottomright.golden.json new file mode 100644 index 00000000..4dcd0d12 --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-e-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-e-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-e-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-e-topleft.golden.json new file mode 100644 index 00000000..afa0c4c2 --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-e-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-e-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-n-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-n-bottomright.golden.json new file mode 100644 index 00000000..334fd44c --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-n-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-n-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-n-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-n-topleft.golden.json new file mode 100644 index 00000000..2ca93ac0 --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-n-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-n-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-ne-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-ne-bottomright.golden.json new file mode 100644 index 00000000..da4a7693 --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-ne-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-ne-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-ne-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-ne-topleft.golden.json new file mode 100644 index 00000000..fad9ea47 --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-ne-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-ne-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-nw-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-nw-bottomright.golden.json new file mode 100644 index 00000000..0b988821 --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-nw-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-nw-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-nw-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-nw-topleft.golden.json new file mode 100644 index 00000000..4dd79f1a --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-nw-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-nw-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-s-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-s-bottomright.golden.json new file mode 100644 index 00000000..72bdf25f --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-s-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-s-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-s-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-s-topleft.golden.json new file mode 100644 index 00000000..946d4b49 --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-s-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-s-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-se-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-se-bottomright.golden.json new file mode 100644 index 00000000..46a1e585 --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-se-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-se-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-se-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-se-topleft.golden.json new file mode 100644 index 00000000..638ab179 --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-se-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-se-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-sw-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-sw-bottomright.golden.json new file mode 100644 index 00000000..e568e7e4 --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-sw-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-sw-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-sw-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-sw-topleft.golden.json new file mode 100644 index 00000000..a0499ffa --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-sw-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-sw-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-w-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-w-bottomright.golden.json new file mode 100644 index 00000000..acaf677a --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-w-bottomright.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-w-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-w-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-w-topleft.golden.json new file mode 100644 index 00000000..7dedb0c6 --- /dev/null +++ b/__tests__/golden/__golden__/browser-ResizableBox-w-topleft.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-w-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-controlled-frozen.golden.json b/__tests__/golden/__golden__/browser-controlled-frozen.golden.json new file mode 100644 index 00000000..c4215bbc --- /dev/null +++ b/__tests__/golden/__golden__/browser-controlled-frozen.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"frozen","name":"browser-controlled-frozen","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-grid-relative-deltas.golden.json b/__tests__/golden/__golden__/browser-grid-relative-deltas.golden.json new file mode 100644 index 00000000..4d0c31e4 --- /dev/null +++ b/__tests__/golden/__golden__/browser-grid-relative-deltas.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-grid-relative-deltas","opts":{"grid":[10,10]},"pointer":"mouse","points":[[2,2],[6,6],[14,14],[26,26]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":2,"clientY":2,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":6,"clientY":6,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":14,"clientY":14,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":26,"clientY":26,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":26,"clientY":26,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":4,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":4,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-known-lock-axis-x.golden.json b/__tests__/golden/__golden__/browser-known-lock-axis-x.golden.json new file mode 100644 index 00000000..8e28edc5 --- /dev/null +++ b/__tests__/golden/__golden__/browser-known-lock-axis-x.golden.json @@ -0,0 +1,10 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":50,"kind":"default","knownBug":"5.2: aspect projection changes height with axis x","lock":true,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-known-lock-axis-x","opts":{},"pointer":"mouse","points":[[20,0]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":58,"width":116}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":58,"width":116}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-known-mouseup-delta.golden.json b/__tests__/golden/__golden__/browser-known-mouseup-delta.golden.json new file mode 100644 index 00000000..819e9519 --- /dev/null +++ b/__tests__/golden/__golden__/browser-known-mouseup-delta.golden.json @@ -0,0 +1,10 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.5: mouseup delta is dropped and stop reports the last move","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-known-mouseup-delta","opts":{},"pointer":"mouse","points":[[10,10]],"scale":1,"up":[30,30],"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-lock-max-binding.golden.json b/__tests__/golden/__golden__/browser-lock-max-binding.golden.json new file mode 100644 index 00000000..d1885f97 --- /dev/null +++ b/__tests__/golden/__golden__/browser-lock-max-binding.golden.json @@ -0,0 +1,10 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":50,"kind":"default","knownBug":"5.1: independent max clamping distorts the aspect ratio","lock":true,"max":[120,1000],"min":[20,20],"mode":"follow","name":"browser-lock-max-binding","opts":{},"pointer":"mouse","points":[[50,0]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-scale-0.5-nw.golden.json b/__tests__/golden/__golden__/browser-scale-0.5-nw.golden.json new file mode 100644 index 00000000..bf93209e --- /dev/null +++ b/__tests__/golden/__golden__/browser-scale-0.5-nw.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-scale-0.5-nw","opts":{},"pointer":"mouse","scale":0.5,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":140,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"140px","tag":"div","width":"140px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-scale-0.5-se.golden.json b/__tests__/golden/__golden__/browser-scale-0.5-se.golden.json new file mode 100644 index 00000000..d80b41d9 --- /dev/null +++ b/__tests__/golden/__golden__/browser-scale-0.5-se.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-scale-0.5-se","opts":{},"pointer":"mouse","scale":0.5,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-scale-2-nw.golden.json b/__tests__/golden/__golden__/browser-scale-2-nw.golden.json new file mode 100644 index 00000000..59922a6b --- /dev/null +++ b/__tests__/golden/__golden__/browser-scale-2-nw.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-scale-2-nw","opts":{},"pointer":"mouse","scale":2,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":115,"width":115}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":115,"width":115}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-scale-2-se.golden.json b/__tests__/golden/__golden__/browser-scale-2-se.golden.json new file mode 100644 index 00000000..847e6950 --- /dev/null +++ b/__tests__/golden/__golden__/browser-scale-2-se.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-scale-2-se","opts":{},"pointer":"mouse","scale":2,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":115}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-strict-box.golden.json b/__tests__/golden/__golden__/browser-strict-box.golden.json new file mode 100644 index 00000000..966eda43 --- /dev/null +++ b/__tests__/golden/__golden__/browser-strict-box.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-strict-box","opts":{},"pointer":"mouse","scale":1,"strict":true,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"170px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"180px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"260px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"270px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"290px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"310px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"350px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"360px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/cadence-B-stale-props-255.golden.json b/__tests__/golden/__golden__/cadence-B-stale-props-255.golden.json new file mode 100644 index 00000000..f987742d --- /dev/null +++ b/__tests__/golden/__golden__/cadence-B-stale-props-255.golden.json @@ -0,0 +1,14 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"cadence-B-stale-props-255","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[20,20],[30,30]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/callback-false-is-ignored.golden.json b/__tests__/golden/__golden__/callback-false-is-ignored.golden.json new file mode 100644 index 00000000..d7937597 --- /dev/null +++ b/__tests__/golden/__golden__/callback-false-is-ignored.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"callback-false-is-ignored","opts":{},"pointer":"mouse","returnFalse":true,"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/controlled-clamp.golden.json b/__tests__/golden/__golden__/controlled-clamp.golden.json new file mode 100644 index 00000000..d6f38f96 --- /dev/null +++ b/__tests__/golden/__golden__/controlled-clamp.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"clamp","name":"controlled-clamp","opts":{},"pointer":"mouse","points":[[40,40],[80,80],[50,50]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":140,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":40,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":80,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":150,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":50,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":150,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":50,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/controlled-frozen.golden.json b/__tests__/golden/__golden__/controlled-frozen.golden.json new file mode 100644 index 00000000..b6c358c7 --- /dev/null +++ b/__tests__/golden/__golden__/controlled-frozen.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"frozen","name":"controlled-frozen","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/draggable-cancel.golden.json b/__tests__/golden/__golden__/draggable-cancel.golden.json new file mode 100644 index 00000000..fb897a88 --- /dev/null +++ b/__tests__/golden/__golden__/draggable-cancel.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"draggable-cancel","opts":{"cancel":".react-resizable-handle"},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":0,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/draggable-disabled.golden.json b/__tests__/golden/__golden__/draggable-disabled.golden.json new file mode 100644 index 00000000..f655e7fb --- /dev/null +++ b/__tests__/golden/__golden__/draggable-disabled.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"draggable-disabled","opts":{"disabled":true},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":0,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/draggable-double-scale.golden.json b/__tests__/golden/__golden__/draggable-double-scale.golden.json new file mode 100644 index 00000000..065c3563 --- /dev/null +++ b/__tests__/golden/__golden__/draggable-double-scale.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"draggable-double-scale","opts":{"scale":2},"pointer":"mouse","scale":2,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/draggable-handle-selector.golden.json b/__tests__/golden/__golden__/draggable-handle-selector.golden.json new file mode 100644 index 00000000..2eb5e718 --- /dev/null +++ b/__tests__/golden/__golden__/draggable-handle-selector.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"draggable-handle-selector","opts":{"handle":".does-not-match"},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":0,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/draggable-no-user-select.golden.json b/__tests__/golden/__golden__/draggable-no-user-select.golden.json new file mode 100644 index 00000000..a4364e04 --- /dev/null +++ b/__tests__/golden/__golden__/draggable-no-user-select.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"draggable-no-user-select","opts":{"enableUserSelectHack":false},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/grid-relative-deltas.golden.json b/__tests__/golden/__golden__/grid-relative-deltas.golden.json new file mode 100644 index 00000000..83d57d9e --- /dev/null +++ b/__tests__/golden/__golden__/grid-relative-deltas.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"grid-relative-deltas","opts":{"grid":[10,10]},"pointer":"mouse","points":[[2,2],[6,6],[14,14],[26,26]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":2,"clientY":2,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":6,"clientY":6,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":14,"clientY":14,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":26,"clientY":26,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":26,"clientY":26,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":4,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":4,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/handle-size-large.golden.json b/__tests__/golden/__golden__/handle-size-large.golden.json new file mode 100644 index 00000000..c1f6eba8 --- /dev/null +++ b/__tests__/golden/__golden__/handle-size-large.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[50,50],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"handle-size-large","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/handle-size-small.golden.json b/__tests__/golden/__golden__/handle-size-small.golden.json new file mode 100644 index 00000000..07931414 --- /dev/null +++ b/__tests__/golden/__golden__/handle-size-small.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[5,5],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"handle-size-small","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-aspect-max-drift-batched.golden.json b/__tests__/golden/__golden__/known-aspect-max-drift-batched.golden.json new file mode 100644 index 00000000..ce9b0fe1 --- /dev/null +++ b/__tests__/golden/__golden__/known-aspect-max-drift-batched.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":50,"kind":"default","knownBug":"5.1: binding max distorts the ratio even when props remain stale","lock":true,"max":[120,1000],"min":[20,20],"mode":"follow","name":"known-aspect-max-drift-batched","opts":{},"pointer":"mouse","points":[[50,0],[100,0],[100,60]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":82,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":76.4,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":76.4,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":60,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"76.4px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"76.4px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"76.4px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-aspect-max-drift.golden.json b/__tests__/golden/__golden__/known-aspect-max-drift.golden.json new file mode 100644 index 00000000..da6966b1 --- /dev/null +++ b/__tests__/golden/__golden__/known-aspect-max-drift.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":50,"kind":"default","knownBug":"5.1: binding max distorts the ratio and subsequent projections drift","lock":true,"max":[120,1000],"min":[20,20],"mode":"follow","name":"known-aspect-max-drift","opts":{},"pointer":"mouse","points":[[50,0],[100,0],[100,60]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":91.76165803108807,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"91.76165803108807px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":113.90046800443372,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"113.90046800443372px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":113.90046800443372,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"113.90046800443372px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":60,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"113.90046800443372px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"113.90046800443372px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-axis-none.golden.json b/__tests__/golden/__golden__/known-axis-none.golden.json new file mode 100644 index 00000000..494f3812 --- /dev/null +++ b/__tests__/golden/__golden__/known-axis-none.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.9: axis none suppresses start and stop but activates user-select styles","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-axis-none","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-box-missing-width.golden.json b/__tests__/golden/__golden__/known-box-missing-width.golden.json new file mode 100644 index 00000000..df0ce340 --- /dev/null +++ b/__tests__/golden/__golden__/known-box-missing-width.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.3a: optional width produces NaN in resize callbacks","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-box-missing-width","opts":{},"pointer":"mouse","scale":1,"width":{"$undefined":true}}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-box-resize-after-stop.golden.json b/__tests__/golden/__golden__/known-box-resize-after-stop.golden.json new file mode 100644 index 00000000..322acad6 --- /dev/null +++ b/__tests__/golden/__golden__/known-box-resize-after-stop.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"native-burst","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.4: pending user onResize callbacks commit after onResizeStop","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-box-resize-after-stop","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-draggable-handlers-overwritten.golden.json b/__tests__/golden/__golden__/known-draggable-handlers-overwritten.golden.json new file mode 100644 index 00000000..311016ad --- /dev/null +++ b/__tests__/golden/__golden__/known-draggable-handlers-overwritten.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.6: onStart onDrag onStop and nodeRef in draggableOpts are overwritten","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-draggable-handlers-overwritten","opts":{},"pointer":"mouse","scale":1,"userHandlers":true,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"name":"draggableOpts.onMouseDown","value":"called"},{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-element-ref-overwritten.golden.json b/__tests__/golden/__golden__/known-element-ref-overwritten.golden.json new file mode 100644 index 00000000..7d9ade37 --- /dev/null +++ b/__tests__/golden/__golden__/known-element-ref-overwritten.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"element","knownBug":"5.11: the supplied element ref never receives the handle","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-element-ref-overwritten","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-function-without-ref.golden.json b/__tests__/golden/__golden__/known-function-without-ref.golden.json new file mode 100644 index 00000000..5945c272 --- /dev/null +++ b/__tests__/golden/__golden__/known-function-without-ref.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"fn-no-ref","knownBug":"5.7: function handle without forwarding the ref throws on mousedown","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-function-without-ref","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[" not mounted on DragStart!"],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":0,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-incompatible-axis.golden.json b/__tests__/golden/__golden__/known-incompatible-axis.golden.json new file mode 100644 index 00000000..c1ef07a3 --- /dev/null +++ b/__tests__/golden/__golden__/known-incompatible-axis.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","knownBug":"5.9: an incompatible handle suppresses start and stop","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-incompatible-axis","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-lock-axis-x.golden.json b/__tests__/golden/__golden__/known-lock-axis-x.golden.json new file mode 100644 index 00000000..49a32886 --- /dev/null +++ b/__tests__/golden/__golden__/known-lock-axis-x.golden.json @@ -0,0 +1,10 @@ +{"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":50,"kind":"default","knownBug":"5.2: aspect projection changes height with axis x","lock":true,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-lock-axis-x","opts":{},"pointer":"mouse","points":[[20,0]],"scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":58,"width":116}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":58,"width":116}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-lock-zero-height.golden.json b/__tests__/golden/__golden__/known-lock-zero-height.golden.json new file mode 100644 index 00000000..5c9ca534 --- /dev/null +++ b/__tests__/golden/__golden__/known-lock-zero-height.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":0,"kind":"default","knownBug":"5.3b: infinite aspect ratio produces NaN sizes","lock":true,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[0,0],"mode":"follow","name":"known-lock-zero-height","opts":{},"pointer":"mouse","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-mouseup-delta.golden.json b/__tests__/golden/__golden__/known-mouseup-delta.golden.json new file mode 100644 index 00000000..6ce3d996 --- /dev/null +++ b/__tests__/golden/__golden__/known-mouseup-delta.golden.json @@ -0,0 +1,10 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.5: mouseup delta is dropped and stop reports the last move","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-mouseup-delta","opts":{},"pointer":"mouse","points":[[10,10]],"scale":1,"up":[30,30],"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-scale-zero.golden.json b/__tests__/golden/__golden__/known-scale-zero.golden.json new file mode 100644 index 00000000..430d5c71 --- /dev/null +++ b/__tests__/golden/__golden__/known-scale-zero.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.3c: zero transformScale produces nonfinite sizes","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-scale-zero","opts":{},"pointer":"mouse","scale":0,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-start-constrained.golden.json b/__tests__/golden/__golden__/known-start-constrained.golden.json new file mode 100644 index 00000000..dd7a0c56 --- /dev/null +++ b/__tests__/golden/__golden__/known-start-constrained.golden.json @@ -0,0 +1,11 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":10,"kind":"default","knownBug":"5.8: start reports constrained dimensions before the DOM has that size","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-start-constrained","opts":{},"pointer":"mouse","points":[[5,5],[15,15]],"scale":1,"width":10}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"10px","tag":"div","width":"10px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"10px","tag":"div","width":"10px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":20,"width":20}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"10px","tag":"div","width":"10px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"10px","tag":"div","width":"10px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":5,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":25,"width":25}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"25px","tag":"div","width":"25px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":15,"clientY":15,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":25,"width":25}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"25px","tag":"div","width":"25px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":15,"clientY":15,"target":"document","type":"mouseup"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"25px","tag":"div","width":"25px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":4,"handle":4,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"25px","tag":"div","width":"25px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/strict-box.golden.json b/__tests__/golden/__golden__/strict-box.golden.json new file mode 100644 index 00000000..e6eaa693 --- /dev/null +++ b/__tests__/golden/__golden__/strict-box.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"strict-box","opts":{},"pointer":"mouse","scale":1,"strict":true,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"170px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"180px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"260px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"270px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"290px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"310px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"350px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"360px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/strict-resizable.golden.json b/__tests__/golden/__golden__/strict-resizable.golden.json new file mode 100644 index 00000000..8b036370 --- /dev/null +++ b/__tests__/golden/__golden__/strict-resizable.golden.json @@ -0,0 +1,47 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"strict-resizable","opts":{},"pointer":"mouse","scale":1,"strict":true,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"170px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"180px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"260px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"270px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"290px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"310px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"350px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"360px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/touch-nw-moving-layout.golden.json b/__tests__/golden/__golden__/touch-nw-moving-layout.golden.json new file mode 100644 index 00000000..3bd3501a --- /dev/null +++ b/__tests__/golden/__golden__/touch-nw-moving-layout.golden.json @@ -0,0 +1,12 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"touch-nw-moving-layout","opts":{},"pointer":"touch","scale":1,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +], +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/unmount-mouse.golden.json b/__tests__/golden/__golden__/unmount-mouse.golden.json new file mode 100644 index 00000000..cafff82c --- /dev/null +++ b/__tests__/golden/__golden__/unmount-mouse.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"unmount-mouse","opts":{},"pointer":"mouse","scale":1,"unmount":true,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"type":"unmount"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":null,"handles":[]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":2,"handle":2,"other":0}} +], +"final":{"bodyUserSelect":false,"box":null,"handles":[]}} diff --git a/__tests__/golden/__golden__/unmount-touch.golden.json b/__tests__/golden/__golden__/unmount-touch.golden.json new file mode 100644 index 00000000..a6380d4c --- /dev/null +++ b/__tests__/golden/__golden__/unmount-touch.golden.json @@ -0,0 +1,13 @@ +{"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"unmount-touch","opts":{},"pointer":"touch","scale":1,"unmount":true,"width":100}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"steps":[ +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"type":"unmount"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"touchend"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":null,"handles":[]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":2,"handle":2,"other":0}} +], +"final":{"bodyUserSelect":false,"box":null,"handles":[]}} diff --git a/__tests__/golden/expectGolden.ts b/__tests__/golden/expectGolden.ts new file mode 100644 index 00000000..ee6ef017 --- /dev/null +++ b/__tests__/golden/expectGolden.ts @@ -0,0 +1,16 @@ +import * as fs from 'node:fs'; +import * as path from 'node:path'; +import {serialize} from './serialize'; + +export function expectGolden(name: string, trace: Parameters[0]) { + if (!/^[a-zA-Z0-9.-]+$/.test(name)) throw new Error(`Invalid golden name: ${name}`); + const file = path.join(__dirname, '__golden__', `${name}.golden.json`); + const actual = serialize(trace); + if (process.env.GOLDEN_UPDATE === '1') { + fs.mkdirSync(path.dirname(file), {recursive: true}); + fs.writeFileSync(file, actual); + } + if (!fs.existsSync(file)) throw new Error(`Missing ${name}.golden.json. Run corepack yarn golden:update.`); + // Jest's line diff points directly to the changed input, callback, or DOM field. + expect(actual).toBe(fs.readFileSync(file, 'utf8')); +} diff --git a/__tests__/golden/fixture.tsx b/__tests__/golden/fixture.tsx new file mode 100644 index 00000000..6bde5384 --- /dev/null +++ b/__tests__/golden/fixture.tsx @@ -0,0 +1,69 @@ +import * as React from 'react'; +import Resizable from '../../lib/Resizable'; +import ResizableBox from '../../lib/ResizableBox'; +import {resolved, type Scenario} from './scenarios'; +import type {createRecorder} from './recorder'; + +export type Recorder = ReturnType; + +const ComponentHandle = React.forwardRef(function ComponentHandle({handleAxis, ...rest}, ref) { + return ; +}); + +export function Scene({scenario, recorder, userRef}: {scenario: Scenario; recorder: Recorder; userRef: React.RefObject}) { + const s = resolved(scenario); + const [size, setSize] = React.useState({width: s.width, height: s.height}); + const onResize = (e, data) => { + recorder.callback('onResize')(e, data); + if (s.mode !== 'frozen') { + setSize(s.mode === 'clamp' + ? {width: Math.min(data.size.width, 115), height: Math.min(data.size.height, 115)} : data.size); + } + return s.returnFalse ? false : undefined; + }; + const record = (name: string) => (e, data) => { + recorder.callback(name)(e, data); + return s.returnFalse ? false : undefined; + }; + const kinds = { + default: undefined, + element: } />, + fn: (axis, ref) => , + 'fn-no-ref': axis => , + component: , + }; + const opts = {...s.opts}; + if (s.userHandlers) { + for (const name of ['onStart', 'onDrag', 'onStop', 'onMouseDown']) { + opts[name] = () => recorder.note(`draggableOpts.${name}`, 'called'); + } + opts.nodeRef = userRef; + } + const props = {width: size.width, height: size.height, resizeHandles: s.handles, + axis: s.axis, handle: kinds[s.kind], handleSize: s.handleSize, lockAspectRatio: s.lock, + minConstraints: s.min, maxConstraints: s.max, transformScale: s.scale, + draggableOpts: opts, onResizeStart: record('onResizeStart'), onResize, + onResizeStop: record('onResizeStop'), className: 'outer', 'data-probe': 'passthrough'}; + const content = content; + if (s.component === 'ResizableBox') { + // Keep the external props fixed: ResizableBox owns its own rendered size. + return {content}; + } + return +
{content}
+ ; +} + +// Both layout runners use a 300px stage and 10px handles. No library CSS is assumed. +export function sceneCSS(scenario: Scenario): string { + const s = resolved(scenario); + const position = s.anchor === 'bottomright' ? 'right:0;bottom:0' : 'left:100px;top:100px'; + return `html,body{margin:0} #stage{position:relative;left:400px;top:400px;width:300px;height:300px;transform-origin:0 0;transform:scale(${s.scale || 1})} + .react-resizable{position:absolute;${position}} [data-content]{position:absolute;pointer-events:none} + .react-resizable>:not([data-content]){position:absolute;width:10px;height:10px;touch-action:none} + ` + s.handles.map((axis, i) => { + const horizontal = axis.includes('w') ? 'left:0' : axis.includes('e') ? 'right:0' : 'left:calc(50% - 5px)'; + const vertical = axis.includes('n') ? 'top:0' : axis.includes('s') ? 'bottom:0' : 'top:calc(50% - 5px)'; + return `.react-resizable>:nth-child(${i + 2}){${horizontal};${vertical}}`; + }).join('\n'); +} diff --git a/__tests__/golden/harness.ts b/__tests__/golden/harness.ts new file mode 100644 index 00000000..6ec9f872 --- /dev/null +++ b/__tests__/golden/harness.ts @@ -0,0 +1,142 @@ +import * as React from 'react'; +import {render, act} from '@testing-library/react'; +import {createRecorder, type Input} from './recorder'; +import {Scene} from './fixture'; +import {resolved, type Scenario} from './scenarios'; + +export function installLayout(scenario: Scenario) { + const s = resolved(scenario); + const proto = HTMLElement.prototype; + const originalRect = Object.getOwnPropertyDescriptor(proto, 'getBoundingClientRect'); + const originalOffsetParent = Object.getOwnPropertyDescriptor(proto, 'offsetParent'); + const fallback = proto.getBoundingClientRect; + const reads = {box: 0, handle: 0, other: 0}; + Object.defineProperty(proto, 'getBoundingClientRect', {configurable: true, writable: true, value: function () { + const box = this.closest('.react-resizable') as HTMLElement; + if (!box) { reads.other++; return fallback.call(this); } + const isBox = this === box; + reads[isBox ? 'box' : 'handle']++; + const w = parseFloat(box.style.width) || 0, h = parseFloat(box.style.height) || 0; + let left = s.anchor === 'bottomright' ? 300 - w : 100; + let top = s.anchor === 'bottomright' ? 300 - h : 100; + if (!isBox) { + const children = Array.from(box.children).filter(el => !el.hasAttribute('data-content')); + const axis = s.handles[children.indexOf(this)]; + left += axis.includes('w') ? 0 : axis.includes('e') ? w - 10 : (w - 10) / 2; + top += axis.includes('n') ? 0 : axis.includes('s') ? h - 10 : (h - 10) / 2; + } + const scale = s.scale || 1; + left *= scale; top *= scale; + const width = (isBox ? w : 10) * scale, height = (isBox ? h : 10) * scale; + return {left, top, width, height, right: left + width, bottom: top + height, x: left, y: top, + toJSON() { return {left, top, width, height}; }}; + }}); + Object.defineProperty(proto, 'offsetParent', {configurable: true, get() { + return this.parentElement?.closest('.react-resizable') ?? document.body; + }}); + return {reads, restore() { + if (originalRect) Object.defineProperty(proto, 'getBoundingClientRect', originalRect); + else delete proto.getBoundingClientRect; + if (originalOffsetParent) Object.defineProperty(proto, 'offsetParent', originalOffsetParent); + else Reflect.deleteProperty(proto, 'offsetParent'); + }}; +} + +export function gestureInputs(scenario: Scenario, axis: string): Input[] { + const s = resolved(scenario); + // Relative screen coordinates. Signs grow all handles on the default path. + const points = s.points ?? [[10 * (axis.includes('w') ? -1 : 1), 10 * (axis.includes('n') ? -1 : 1)], + [20 * (axis.includes('w') ? -1 : 1), 20 * (axis.includes('n') ? -1 : 1)], + [30 * (axis.includes('w') ? -1 : 1), 30 * (axis.includes('n') ? -1 : 1)]]; + const names = s.pointer === 'touch' ? ['touchstart', 'touchmove', 'touchend'] : ['mousedown', 'mousemove', 'mouseup']; + const input = (type: string, point: number[], target = 'document') => ({type, clientX: point[0], clientY: point[1], target}); + return [input(names[0], [0, 0], `handle:${axis}`), + ...points.map(p => input(names[1], p)), input(names[2], s.up ?? points[points.length - 1] ?? [0, 0])]; +} + +// Raw DOM dispatch keeps cadence B inside one outer act. RTL fireEvent wraps its own act. +function dispatch(input: Input, handle: HTMLElement) { + const target = input.target === 'document' ? document : handle; + const options = {bubbles: true, cancelable: true, clientX: input.clientX, clientY: input.clientY, button: 0}; + if (input.type.startsWith('mouse')) { + target.dispatchEvent(new window.MouseEvent(input.type, options)); + return; + } + const touch = {identifier: 7, target: handle, clientX: input.clientX, clientY: input.clientY}; + const touches = input.type === 'touchend' ? [] : [touch]; + const event = new window.Event(input.type, options); + Object.defineProperties(event, {touches: {value: touches}, targetTouches: {value: touches}, changedTouches: {value: [touch]}}); + target.dispatchEvent(event); +} + +export async function runScenario(scenario: Scenario) { + const s = resolved(scenario); + const layout = installLayout(s); + const container = document.createElement('div'); + document.body.appendChild(container); + const recorder = createRecorder(s.handles, () => container, () => layout.reads); + const userRef = React.createRef(); + let mounted = true; + let view: ReturnType; + // Drain scheduled selection cleanup at an explicit checkpoint, not wall-clock time. + const originalRAF = window.requestAnimationFrame; + const frames: Array<(time: number) => void> = []; + window.requestAnimationFrame = callback => { frames.push(callback); return frames.length; }; + const onError = (event: any) => { recorder.error(event.error?.message ?? event.message); event.preventDefault(); }; + window.addEventListener('error', onError); + try { + recorder.begin({type: 'mount'}); + const scene = React.createElement(Scene, {scenario: s, recorder, userRef}); + view = render(s.strict ? React.createElement(React.StrictMode, null, scene) : scene, {container}); + recorder.end(); + const initial = recorder.dom(); + const event = (input: Input, handle: HTMLElement) => { + recorder.begin(input); + if (input.type === 'unmount') { view.unmount(); mounted = false; } + else dispatch(input, handle); + recorder.end(); + }; + const gesture = (axis: string) => { + const handle = recorder.handles()[s.handles.indexOf(axis as any)]; + const inputs = gestureInputs(s, axis); + if (s.unmount) inputs.splice(2, 0, {type: 'unmount'}); + for (const input of inputs) { + if (s.cadence === 'per-event') { + act(() => event(input, handle)); + // Include state committed by this event's act in the same step. + recorder.end(); + } else event(input, handle); + } + }; + for (const axis of s.active ?? s.handles) { + if (s.cadence === 'batched') { + act(() => { gesture(axis); recorder.begin({type: 'flush'}); }); + recorder.end(); + } else if (s.cadence === 'native-burst') { + // Deliberately outside act until the whole native tick has completed (bug 5.4). + const globals = globalThis as any; + const previous = globals.IS_REACT_ACT_ENVIRONMENT; + globals.IS_REACT_ACT_ENVIRONMENT = false; + try { + gesture(axis); + recorder.begin({type: 'flush'}); + await act(async () => {}); + recorder.end(); + } finally { globals.IS_REACT_ACT_ENVIRONMENT = previous; } + } else gesture(axis); + if (s.unmount) break; + } + recorder.begin({type: 'animation-frame'}); + act(() => { for (const callback of frames.splice(0)) callback(0); }); + if (s.kind === 'element' || s.userHandlers) recorder.note('userRef', userRef.current ? 'attached' : 'null'); + recorder.end(); + return {scenario: s, initial, steps: recorder.steps, final: recorder.dom()}; + } finally { + if (mounted && view) act(() => view.unmount()); + for (const callback of frames) callback(0); + window.requestAnimationFrame = originalRAF; + window.removeEventListener('error', onError); + container.remove(); + layout.restore(); + } +} diff --git a/__tests__/golden/recorder.ts b/__tests__/golden/recorder.ts new file mode 100644 index 00000000..1d6f5a25 --- /dev/null +++ b/__tests__/golden/recorder.ts @@ -0,0 +1,46 @@ +import type {ResizeCallbackData, ResizeHandleAxis} from '../../lib/propTypes'; + +export type Input = {type: string; target?: string; clientX?: number; clientY?: number}; +export type Step = {input: Input; calls: any[]; errors: string[]; dom?: any; rectReads?: any}; + +// Shared by jsdom and the browser. Reading the DOM here must never read layout. +export function createRecorder(axes: ResizeHandleAxis[], getContainer: () => HTMLElement, reads: () => any) { + const ids = new WeakMap(); + const generations: Record = {}; + const steps: Step[] = []; + let current: Step; + const handles = () => Array.from(getContainer().querySelector('.react-resizable')?.children ?? []) + .filter((el: HTMLElement) => !el.hasAttribute('data-content')) as HTMLElement[]; + const identity = (node: HTMLElement, axis: string) => { + if (!ids.has(node)) ids.set(node, `handle:${axis}#${generations[axis] = (generations[axis] ?? 0) + 1}`); + return ids.get(node); + }; + const dom = () => { + const box = getContainer().querySelector('.react-resizable'); + const rendered = handles(); + return { + box: box ? {tag: box.tagName.toLowerCase(), className: box.className, + width: box.style.width, height: box.style.height, + attrs: Array.from(box.attributes).filter(a => a.name !== 'style' && a.name !== 'class') + .map(a => [a.name, a.value]).sort(), + childOrder: Array.from(box.children).map(el => el.hasAttribute('data-content') ? 'content' : `handle:${axes[rendered.indexOf(el as HTMLElement)]}`)} : null, + handles: rendered.map((el, i) => ({axis: axes[i], tag: el.tagName.toLowerCase(), + className: el.className, node: identity(el, axes[i])})), + bodyUserSelect: document.body.classList.contains('react-draggable-transparent-selection'), + }; + }; + const begin = (input: Input) => { + current = {input, calls: [], errors: []}; + steps.push(current); + }; + const end = () => { current.dom = dom(); current.rectReads = {...reads()}; }; + const callback = (name: string) => (e: any, data: ResizeCallbackData) => { + const expected = handles()[axes.indexOf(data.handle)]; + current.calls.push({name, handle: data.handle, size: {...data.size}, + eventKind: e.nativeEvent ? 'synthetic' : 'native', eventType: e.type, + node: identity(data.node, data.handle), nodeIsHandle: data.node === expected}); + }; + return {steps, begin, end, dom, callback, handles, + error: (message: string) => current.errors.push(message), + note: (name: string, value: unknown) => current.calls.push({name, value})}; +} diff --git a/__tests__/golden/scenarios.ts b/__tests__/golden/scenarios.ts new file mode 100644 index 00000000..9e3b0dea --- /dev/null +++ b/__tests__/golden/scenarios.ts @@ -0,0 +1,144 @@ +import type {Axis, ResizeHandleAxis} from '../../lib/propTypes'; + +export const axes: ResizeHandleAxis[] = ['s', 'w', 'e', 'n', 'sw', 'nw', 'se', 'ne']; +export type Scenario = { + name: string; + component?: 'Resizable' | 'ResizableBox'; + handles?: ResizeHandleAxis[]; + active?: ResizeHandleAxis[]; + axis?: Axis; + mode?: 'follow' | 'frozen' | 'clamp'; + cadence?: 'per-event' | 'batched' | 'native-burst'; + anchor?: 'topleft' | 'bottomright'; + pointer?: 'mouse' | 'touch'; + width?: number; + height?: number; + min?: [number, number] | null; + max?: [number, number] | null; + lock?: boolean; + scale?: number; + kind?: 'default' | 'element' | 'fn' | 'fn-no-ref' | 'component'; + handleSize?: [number, number]; + opts?: Record; + userHandlers?: boolean; + returnFalse?: boolean; + points?: [number, number][]; + up?: [number, number]; + strict?: boolean; + unmount?: boolean; + knownBug?: string; +}; + +export function resolved(s: Scenario) { + return {component: 'Resizable', handles: ['se'], axis: 'both', mode: 'follow', + cadence: 'per-event', anchor: 'topleft', pointer: 'mouse', width: 100, height: 100, + min: [20, 20], max: [Infinity, Infinity], lock: false, scale: 1, + kind: 'default', handleSize: [20, 20], opts: {}, ...s} as Required; +} + +// Four paths expose accumulation, a repeated coordinate, and a return from overshoot. +export const paths: [number, number][][] = [ + [[10, 10], [20, 20], [30, 30]], + [[10, 5], [10, 5], [0, 0]], + [[-100, -100], [-60, -60], [-20, -20], [10, 10]], + [[80, 60], [40, 30], [10, 10], [-10, -10]], +]; + +const components = ['Resizable', 'ResizableBox'] as const; +export const matrix: Scenario[] = []; +for (const component of components) { + // Full handle × axis × anchor × cadence coverage owns the layout correction. + for (const handle of axes) { + for (const axis of ['both', 'x', 'y', 'none'] as const) { + for (const anchor of ['topleft', 'bottomright'] as const) { + for (const cadence of ['per-event', 'batched'] as const) { + matrix.push({name: `${component}-${handle}-${axis}-${anchor}-${cadence}`, + component, handles: [handle], axis, anchor, cadence}); + } + } + } + } + for (const axis of ['both', 'x', 'y', 'none'] as const) { + for (const anchor of ['topleft', 'bottomright'] as const) { + for (const cadence of ['per-event', 'batched'] as const) { + matrix.push({name: `${component}-all-handles-${axis}-${anchor}-${cadence}`, component, + handles: axes, axis, anchor, cadence}); + } + } + } + // Deterministic combinations exercise custom handles, scales, constraints, and paths. + for (let a = 0; a < 4; a++) { + for (let b = 0; b < 4; b++) { + const constraint = (a + b) % 4; + matrix.push({name: `${component}-options-${a}-${b}`, component, + handles: [axes[(a * 4 + b) % 8]], + kind: (['default', 'element', 'fn', 'component'] as const)[a], + scale: [0.5, 1, 2, 1][b], lock: (a + b) % 2 === 0, + min: constraint === 0 ? null : [80, 70], + max: constraint < 2 ? null : [120, 115], + points: paths[(a + 2 * b) % 4], anchor: a % 2 ? 'bottomright' : 'topleft', + pointer: b % 2 ? 'mouse' : 'touch', mode: (['follow', 'frozen', 'clamp', 'follow'] as const)[b]}); + } + } + for (const lock of [false, true]) { + const cases: Array> = [ + {name: 'unbounded', min: null, max: null, points: paths[0]}, + {name: 'min-not-binding', min: [20, 20], max: null, points: paths[0]}, + {name: 'min-binding-return', min: [80, 70], max: null, points: paths[2]}, + {name: 'max-not-binding', min: null, max: [1000, 1000], points: paths[0]}, + {name: 'max-binding-return', min: null, max: [120, 115], points: paths[3]}, + {name: 'tight-min-max', min: [90, 90], max: [110, 110], points: paths[2]}, + ]; + for (const entry of cases) { + matrix.push({...entry, name: `${component}-constraints-${entry.name}-lock-${lock}`, component, lock}); + } + } +} + +export const regressions: Scenario[] = [ + {name: 'known-aspect-max-drift', width: 100, height: 50, lock: true, max: [120, 1000], points: [[50, 0], [100, 0], [100, 60]], knownBug: '5.1: binding max distorts the ratio and subsequent projections drift'}, + {name: 'known-aspect-max-drift-batched', width: 100, height: 50, lock: true, max: [120, 1000], cadence: 'batched', points: [[50, 0], [100, 0], [100, 60]], knownBug: '5.1: binding max distorts the ratio even when props remain stale'}, + {name: 'known-lock-axis-x', width: 100, height: 50, lock: true, axis: 'x', points: [[20, 0]], knownBug: '5.2: aspect projection changes height with axis x'}, + {name: 'known-box-missing-width', component: 'ResizableBox', axis: 'y', width: undefined, knownBug: '5.3a: optional width produces NaN in resize callbacks'}, + {name: 'known-lock-zero-height', height: 0, lock: true, min: [0, 0], knownBug: '5.3b: infinite aspect ratio produces NaN sizes'}, + {name: 'known-scale-zero', scale: 0, knownBug: '5.3c: zero transformScale produces nonfinite sizes'}, + {name: 'known-box-resize-after-stop', component: 'ResizableBox', cadence: 'native-burst', knownBug: '5.4: pending user onResize callbacks commit after onResizeStop'}, + {name: 'known-mouseup-delta', points: [[10, 10]], up: [30, 30], knownBug: '5.5: mouseup delta is dropped and stop reports the last move'}, + {name: 'known-draggable-handlers-overwritten', userHandlers: true, knownBug: '5.6: onStart onDrag onStop and nodeRef in draggableOpts are overwritten'}, + {name: 'known-function-without-ref', kind: 'fn-no-ref', knownBug: '5.7: function handle without forwarding the ref throws on mousedown'}, + {name: 'known-start-constrained', width: 10, height: 10, points: [[5, 5], [15, 15]], knownBug: '5.8: start reports constrained dimensions before the DOM has that size'}, + {name: 'known-axis-none', axis: 'none', knownBug: '5.9: axis none suppresses start and stop but activates user-select styles'}, + {name: 'known-incompatible-axis', axis: 'x', handles: ['n'], knownBug: '5.9: an incompatible handle suppresses start and stop'}, + {name: 'known-element-ref-overwritten', kind: 'element', knownBug: '5.11: the supplied element ref never receives the handle'}, + {name: 'handle-size-small', handleSize: [5, 5]}, + {name: 'handle-size-large', handleSize: [50, 50]}, + {name: 'grid-relative-deltas', opts: {grid: [10, 10]}, points: [[2, 2], [6, 6], [14, 14], [26, 26]]}, + {name: 'draggable-disabled', opts: {disabled: true}}, + {name: 'draggable-cancel', opts: {cancel: '.react-resizable-handle'}}, + {name: 'draggable-handle-selector', opts: {handle: '.does-not-match'}}, + {name: 'draggable-no-user-select', opts: {enableUserSelectHack: false}}, + {name: 'draggable-double-scale', scale: 2, opts: {scale: 2}}, + {name: 'controlled-frozen', mode: 'frozen'}, + {name: 'controlled-clamp', mode: 'clamp', points: [[40, 40], [80, 80], [50, 50]]}, + {name: 'cadence-B-stale-props-255', cadence: 'batched', points: [[10, 10], [20, 20], [20, 20], [30, 30]]}, + {name: 'box-cadence-B-stale-props-255', component: 'ResizableBox', cadence: 'batched'}, + {name: 'callback-false-is-ignored', returnFalse: true}, + {name: 'touch-nw-moving-layout', pointer: 'touch', handles: ['nw'], anchor: 'bottomright'}, + {name: 'unmount-mouse', unmount: true}, + {name: 'unmount-touch', unmount: true, pointer: 'touch', handles: ['nw'], anchor: 'bottomright'}, + {name: 'strict-resizable', strict: true, handles: axes, anchor: 'bottomright'}, + {name: 'strict-box', strict: true, component: 'ResizableBox', handles: axes, anchor: 'bottomright'}, +]; + +// Real-browser parity includes both components, every handle/anchor, then edge cases. +export const browserScenarios: Scenario[] = [ + ...components.flatMap(component => axes.flatMap(handle => (['topleft', 'bottomright'] as const) + .map(anchor => ({name: `browser-${component}-${handle}-${anchor}`, component, handles: [handle], anchor})))), + ...regressions.filter(s => ['known-lock-axis-x', 'known-mouseup-delta', 'grid-relative-deltas', 'controlled-frozen', 'strict-box'].includes(s.name)) + .map(s => ({...s, name: `browser-${s.name}`})), + // Integer CSS sizes allow exact style comparisons across CSSOM implementations. + {name: 'browser-lock-max-binding', width: 100, height: 50, lock: true, + max: [120, 1000], points: [[50, 0]], knownBug: '5.1: independent max clamping distorts the aspect ratio'}, + ...[0.5, 2].flatMap(scale => ['se', 'nw'].map(handle => ({name: `browser-scale-${scale}-${handle}`, + scale, handles: [handle as ResizeHandleAxis], anchor: 'bottomright' as const}))), +]; diff --git a/__tests__/golden/scenarios/interactions.golden.test.tsx b/__tests__/golden/scenarios/interactions.golden.test.tsx new file mode 100644 index 00000000..2cf290d1 --- /dev/null +++ b/__tests__/golden/scenarios/interactions.golden.test.tsx @@ -0,0 +1,9 @@ +import {matrix, regressions, browserScenarios} from '../scenarios'; +import {runScenario} from '../harness'; +import {expectGolden} from '../expectGolden'; + +describe('golden interaction boundary', () => { + test.each([...matrix, ...regressions, ...browserScenarios])('$name', async scenario => { // eslint-disable-line jest/expect-expect + expectGolden(scenario.name, await runScenario(scenario)); + }); +}); diff --git a/__tests__/golden/serialize.ts b/__tests__/golden/serialize.ts new file mode 100644 index 00000000..4fec0a81 --- /dev/null +++ b/__tests__/golden/serialize.ts @@ -0,0 +1,17 @@ +// JSON stays valid, but values JSON normally loses retain their identity. +export function stableValue(value: unknown): any { + if (value === undefined) return {$undefined: true}; + if (typeof value === 'number' && !Number.isFinite(value)) return {$number: String(value)}; + if (Object.is(value, -0)) return {$number: '-0'}; + if (Array.isArray(value)) return value.map(stableValue); + if (value && typeof value === 'object') { + return Object.fromEntries(Object.keys(value).sort().map(key => [key, stableValue(value[key])])); + } + return value; +} + +export function serialize(trace: {scenario: unknown; initial: unknown; steps: unknown[]; final: unknown}): string { + const json = (value: unknown) => JSON.stringify(stableValue(value)); + return `{"scenario":${json(trace.scenario)},\n"initial":${json(trace.initial)},\n"steps":[\n` + + trace.steps.map(json).join(',\n') + `\n],\n"final":${json(trace.final)}}\n`; +} diff --git a/jest.config.js b/jest.config.js index f95ca1cd..bcc2d5a2 100644 --- a/jest.config.js +++ b/jest.config.js @@ -2,6 +2,7 @@ const path = require('path'); module.exports = { testEnvironment: 'jsdom', + testMatch: ['**/?(*.)+(spec|test).[jt]s?(x)'], coverageThreshold: { global: { branches: 70, // TODO: > 80 diff --git a/package.json b/package.json index b4e426b2..5d7c9018 100644 --- a/package.json +++ b/package.json @@ -11,9 +11,10 @@ ], "scripts": { "lint": "eslint lib/ __tests__/ setupTests/", - "typecheck": "tsc --noEmit", + "typecheck": "tsc --noEmit && tsc --project tsconfig.golden.json", "test": "jest --coverage", "unit": "jest --watch --verbose", + "golden:update": "cross-env GOLDEN_UPDATE=1 jest __tests__/golden/scenarios --runInBand", "build": "bash build.sh", "build-example": "webpack", "dev": "webpack serve --open", diff --git a/tsconfig.golden.json b/tsconfig.golden.json new file mode 100644 index 00000000..80893956 --- /dev/null +++ b/tsconfig.golden.json @@ -0,0 +1,5 @@ +{ + "extends": "./tsconfig.json", + "include": ["lib/**/*", "__tests__/golden/**/*.ts", "__tests__/golden/**/*.tsx"], + "exclude": ["node_modules", "build"] +} From e2a5c098d9473f6f7c8a7cef0c877514c96427c7 Mon Sep 17 00:00:00 2001 From: Samuel Reed Date: Sat, 31 Oct 2026 16:33:56 -0400 Subject: [PATCH 2/6] test: cross-check golden traces with native browser input Run the shared fixture against lib source and real Chromium layout so the fake layout model can be checked independently. Compare callbacks and DOM fields with the committed jsdom traces using trusted mouse input. Keep Playwright in a standalone browser project and support installed browser paths for offline use. Browser launch aborted in this sandbox, so runtime parity remains unverified. --- __tests__/golden/browser/README.md | 46 +++++++++++ __tests__/golden/browser/app.tsx | 87 +++++++++++++++++++++ __tests__/golden/browser/package.json | 6 ++ __tests__/golden/browser/run.cjs | 108 ++++++++++++++++++++++++++ package.json | 1 + 5 files changed, 248 insertions(+) create mode 100644 __tests__/golden/browser/README.md create mode 100644 __tests__/golden/browser/app.tsx create mode 100644 __tests__/golden/browser/package.json create mode 100644 __tests__/golden/browser/run.cjs diff --git a/__tests__/golden/browser/README.md b/__tests__/golden/browser/README.md new file mode 100644 index 00000000..63759889 --- /dev/null +++ b/__tests__/golden/browser/README.md @@ -0,0 +1,46 @@ +Run `yarn golden:browser` from the repository root after the jsdom goldens exist. + +```text +lib source ─▶ webpack ─▶ Chromium mouse input ─▶ shared recorder + │ +jsdom .golden.json ───────────────────────────────────┴─▶ exact comparison +``` + +Install this directory's pinned Playwright dependency separately when needed: + +```sh +npm install --prefix __tests__/golden/browser +__tests__/golden/browser/node_modules/.bin/playwright install chromium +yarn golden:browser +``` + +The runner never downloads dependencies or browsers. `PLAYWRIGHT_MODULE` can +point to an existing Playwright installation. `PLAYWRIGHT_CHROMIUM_EXECUTABLE` +can select an existing Chromium executable when its cached revision differs +from Playwright's default. The root package does not depend on Playwright. + +The shared `browserScenarios` select both components, all eight handles, both +anchors, scale changes, and current edge-case behavior. Every case uses real +Chromium layout and trusted mouse input. Each gesture starts at the actual +handle center. Recorded input coordinates remain relative to that center so +they match jsdom's input schema. The displaced-mouseup case uses Chromium's +input protocol to release at a new location without inserting a mousemove. +The stage has room on every side so growing north/west handles stay within the +viewport during the all-handles case. The aspect/max example uses integer sizes; +jsdom and Chromium serialize fractional CSS dimensions with different precision. +The full drifting sequence remains pinned in the jsdom suite. + +Every input runs inside an async React `act` scope. The runner waits for the +commit before recording the DOM, matching jsdom's per-event cadence. A controlled +animation-frame queue gives selection cleanup its own final checkpoint. + +The comparison includes ordered callbacks, exact sizes, event type and kind, +handle identity, errors, input steps, and every recorded DOM field including +body selection state. The only excluded field is `steps[*].rectReads`, which +counts jsdom's simulated layout calls. Chromium uses native layout, and choosing +the mouse origin adds a real layout read. Expected files are read-only. Missing +files fail the run. + +Webpack output and mismatch traces stay in the temporary directory printed by +the runner. Browser launch failures print the full Playwright diagnostic and +fail the command. diff --git a/__tests__/golden/browser/app.tsx b/__tests__/golden/browser/app.tsx new file mode 100644 index 00000000..0747be35 --- /dev/null +++ b/__tests__/golden/browser/app.tsx @@ -0,0 +1,87 @@ +import * as React from 'react'; +import {createRoot} from 'react-dom/client'; +import {Scene, sceneCSS} from '../fixture'; +import {createRecorder, type Input} from '../recorder'; +import {browserScenarios, resolved} from '../scenarios'; +import {stableValue} from '../serialize'; + +// Keep React's event cadence aligned with the jsdom harness while Playwright +// supplies trusted mouse events through Chromium's input protocol. +(globalThis as any).IS_REACT_ACT_ENVIRONMENT = true; +const frames: Array<(time: number) => void> = []; +window.requestAnimationFrame = callback => { frames.push(callback); return frames.length; }; + +const stage = document.createElement('div'); +stage.id = 'stage'; +document.body.appendChild(stage); +const style = document.createElement('style'); +document.head.appendChild(style); +const root = createRoot(stage); +let scenario: ReturnType; +let recorder: ReturnType; +let initial: unknown; +let release: () => void; +let pending: Promise; +const userRef = React.createRef(); +window.addEventListener('error', event => { + recorder.error(event.error?.message ?? event.message); + event.preventDefault(); +}); + +function inputs(axis: string): Input[] { + const points = scenario.points ?? [10, 20, 30].map(n => + [n * (axis.includes('w') ? -1 : 1), n * (axis.includes('n') ? -1 : 1)]); + const input = (type: string, point: number[], target = 'document') => + ({type, target, clientX: point[0], clientY: point[1]}); + return [input('mousedown', [0, 0], `handle:${axis}`), + ...points.map(point => input('mousemove', point)), + input('mouseup', scenario.up ?? points[points.length - 1] ?? [0, 0])]; +} + +(window as any).goldenBrowser = { + names: browserScenarios.map(s => s.name), + async mount(name: string) { + const selected = browserScenarios.find(s => s.name === name); + if (!selected) throw new Error(`Unknown browser scenario: ${name}`); + scenario = resolved(selected); + if (scenario.pointer !== 'mouse' || scenario.cadence !== 'per-event') { + throw new Error(`Browser runner requires per-event mouse input: ${name}`); + } + style.textContent = sceneCSS(scenario); + recorder = createRecorder(scenario.handles, () => stage, () => ({})); + recorder.begin({type: 'mount'}); + const scene = ; + await React.act(async () => { + root.render(scenario.strict ? {scene} : scene); + }); + recorder.end(); + initial = recorder.dom(); + return (scenario.active ?? scenario.handles).map(axis => ({axis, inputs: inputs(axis)})); + }, + origin(axis: string) { + const handle = recorder.handles()[scenario.handles.indexOf(axis as any)]; + const rect = handle.getBoundingClientRect(); + if (!rect.width || !rect.height) throw new Error(`Handle ${axis} has no hit area`); + return {x: rect.left + rect.width / 2, y: rect.top + rect.height / 2}; + }, + begin(input: Input) { + recorder.begin(input); + pending = Promise.resolve(React.act(async () => { + await new Promise(resolve => { release = resolve; }); + })); + }, + async end() { + release(); + await pending; + recorder.end(); + }, + async finish() { + recorder.begin({type: 'animation-frame'}); + await React.act(async () => { for (const callback of frames.splice(0)) callback(0); }); + if (scenario.kind === 'element' || scenario.userHandlers) { + recorder.note('userRef', userRef.current ? 'attached' : 'null'); + } + recorder.end(); + return stableValue({scenario, initial, steps: recorder.steps, final: recorder.dom()}); + }, +}; diff --git a/__tests__/golden/browser/package.json b/__tests__/golden/browser/package.json new file mode 100644 index 00000000..cb32ef55 --- /dev/null +++ b/__tests__/golden/browser/package.json @@ -0,0 +1,6 @@ +{ + "name": "react-resizable-golden-browser", + "private": true, + "scripts": {"test": "node run.cjs"}, + "devDependencies": {"playwright": "1.62.1"} +} diff --git a/__tests__/golden/browser/run.cjs b/__tests__/golden/browser/run.cjs new file mode 100644 index 00000000..fdcf81e0 --- /dev/null +++ b/__tests__/golden/browser/run.cjs @@ -0,0 +1,108 @@ +const assert = require('node:assert/strict'); +const fs = require('node:fs'); +const os = require('node:os'); +const path = require('node:path'); +const {pathToFileURL} = require('node:url'); +const webpack = require('webpack'); + +const repo = path.resolve(__dirname, '../../..'); +const output = fs.mkdtempSync(path.join(os.tmpdir(), 'react-resizable-browser-')); + +function bundle() { + return new Promise((resolve, reject) => { + const compiler = webpack({ + mode: 'development', + context: repo, + entry: path.join(__dirname, 'app.tsx'), + output: {path: output, filename: 'app.js'}, + devtool: false, + resolve: {extensions: ['.tsx', '.ts', '.js']}, + module: {rules: [{test: /\.[jt]sx?$/, exclude: /node_modules/, + loader: require.resolve('babel-loader'), + options: {configFile: path.join(repo, '.babelrc'), babelrc: false}}]}, + }); + compiler.run((error, stats) => { + compiler.close(closeError => { + if (error || closeError) return reject(error || closeError); + if (stats.hasErrors()) return reject(new Error(stats.toString({all: false, errors: true}))); + resolve(); + }); + }); + }); +} + +// Native Chromium layout is independent of the deterministic jsdom layout shim. +// Ignore only the shim's instrumentation counters; every observed field remains. +function observable(trace) { + return {...trace, steps: trace.steps.map(({rectReads, ...step}) => step)}; +} + +async function main() { + await bundle(); + fs.writeFileSync(path.join(output, 'index.html'), + ''); + const {chromium} = require(process.env.PLAYWRIGHT_MODULE || 'playwright'); + // One launch attempt: preserve Chromium's full diagnostic if the host blocks it. + const browser = await chromium.launch({headless: true, + ...(process.env.PLAYWRIGHT_CHROMIUM_EXECUTABLE + ? {executablePath: process.env.PLAYWRIGHT_CHROMIUM_EXECUTABLE} : {})}); + const failures = []; + let checked = 0; + try { + const listingPage = await browser.newPage(); + const url = pathToFileURL(path.join(output, 'index.html')).href; + await listingPage.goto(url); + const names = await listingPage.evaluate(() => window.goldenBrowser.names); + assert.ok(names.length > 0, 'No browser scenarios were loaded'); + await listingPage.close(); + for (const name of names) { + const page = await browser.newPage({viewport: {width: 2000, height: 2000}}); + await page.goto(url); + const gestures = await page.evaluate(name => window.goldenBrowser.mount(name), name); + for (const gesture of gestures) { + const origin = await page.evaluate(axis => window.goldenBrowser.origin(axis), gesture.axis); + await page.mouse.move(origin.x, origin.y); + for (const input of gesture.inputs) { + await page.evaluate(input => window.goldenBrowser.begin(input), input); + if (input.type === 'mousedown') await page.mouse.down(); + else if (input.type === 'mousemove') { + await page.mouse.move(origin.x + input.clientX, origin.y + input.clientY); + } else if (input.type === 'mouseup' && !name.endsWith('known-mouseup-delta')) { + await page.mouse.up(); + } else if (input.type === 'mouseup') { + // The displaced-mouseup case must release at a new location without + // synthesizing a mousemove, which would change the behavior tested. + const session = await page.context().newCDPSession(page); + await session.send('Input.dispatchMouseEvent', {type: 'mouseReleased', + x: origin.x + input.clientX, y: origin.y + input.clientY, + button: 'left', buttons: 0, clickCount: 1}); + await session.detach(); + } else throw new Error(`Unsupported browser input: ${input.type}`); + await page.evaluate(() => window.goldenBrowser.end()); + } + } + const actual = await page.evaluate(() => window.goldenBrowser.finish()); + const expectedPath = path.join(__dirname, '../__golden__', `${name}.golden.json`); + try { + const expected = JSON.parse(fs.readFileSync(expectedPath, 'utf8')); + assert.deepStrictEqual(observable(actual), observable(expected)); + checked++; + process.stdout.write(`PASS ${name}\n`); + } catch (error) { + fs.writeFileSync(path.join(output, `${name}.actual.json`), JSON.stringify(actual, null, 2) + '\n'); + failures.push(name); + process.stderr.write(`FAIL ${name}\n${error.stack}\n`); + } + await page.close(); + } + } finally { + await browser.close(); + } + process.stdout.write(`Browser parity: ${checked} passed, ${failures.length} failed. Artifacts: ${output}\n`); + if (failures.length) process.exitCode = 1; +} + +main().catch(error => { + process.stderr.write(`${error.stack}\nBrowser artifacts: ${output}\n`); + process.exitCode = 1; +}); diff --git a/package.json b/package.json index 5d7c9018..cbe876c8 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,7 @@ "test": "jest --coverage", "unit": "jest --watch --verbose", "golden:update": "cross-env GOLDEN_UPDATE=1 jest __tests__/golden/scenarios --runInBand", + "golden:browser": "node __tests__/golden/browser/run.cjs", "build": "bash build.sh", "build-example": "webpack", "dev": "webpack serve --open", From 4d4056bd5708ba92a9f76f74dfc86b5aaa261e32 Mon Sep 17 00:00:00 2001 From: Samuel Reed Date: Sat, 31 Oct 2026 16:39:00 -0400 Subject: [PATCH 3/6] ci: run the golden browser cross-check on every PR The browser runner loaded Playwright from a nested package.json that nothing installed, so it could only run by hand. Move playwright@1.62.1 to a root devDependency (the version react-grid-layout pins) and run yarn golden:browser in CI after the unit tests. Locally: 42 of 42 browser traces match their jsdom golden files. --- .github/workflows/test.yml | 8 +++++ __tests__/golden/browser/README.md | 14 ++++----- __tests__/golden/browser/package.json | 6 ---- package.json | 1 + yarn.lock | 44 +++++++++++++++++++++++++++ 5 files changed, 60 insertions(+), 13 deletions(-) delete mode 100644 __tests__/golden/browser/package.json diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index e6fe2b6a..a91e47ae 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -49,3 +49,11 @@ jobs: - name: Smoke-test built artifact run: node ./__tests__/integration/smoke.cjs + + - name: Install Playwright Chromium + run: yarn playwright install --with-deps chromium + + # Replays the browser scenarios with real Chromium input and fails if any + # trace differs from its jsdom golden file. + - name: Browser cross-check of golden traces + run: yarn golden:browser diff --git a/__tests__/golden/browser/README.md b/__tests__/golden/browser/README.md index 63759889..9411b27a 100644 --- a/__tests__/golden/browser/README.md +++ b/__tests__/golden/browser/README.md @@ -6,18 +6,18 @@ lib source ─▶ webpack ─▶ Chromium mouse input ─▶ shared recorder jsdom .golden.json ───────────────────────────────────┴─▶ exact comparison ``` -Install this directory's pinned Playwright dependency separately when needed: +Run it locally: ```sh -npm install --prefix __tests__/golden/browser -__tests__/golden/browser/node_modules/.bin/playwright install chromium +yarn playwright install chromium yarn golden:browser ``` -The runner never downloads dependencies or browsers. `PLAYWRIGHT_MODULE` can -point to an existing Playwright installation. `PLAYWRIGHT_CHROMIUM_EXECUTABLE` -can select an existing Chromium executable when its cached revision differs -from Playwright's default. The root package does not depend on Playwright. +`playwright` is a devDependency at the repo root, and CI runs this check after +the unit tests. The runner never downloads browsers. `PLAYWRIGHT_MODULE` can +point to another Playwright installation, and `PLAYWRIGHT_CHROMIUM_EXECUTABLE` +can select an existing Chromium when the cached revision differs from +Playwright's default. The shared `browserScenarios` select both components, all eight handles, both anchors, scale changes, and current edge-case behavior. Every case uses real diff --git a/__tests__/golden/browser/package.json b/__tests__/golden/browser/package.json deleted file mode 100644 index cb32ef55..00000000 --- a/__tests__/golden/browser/package.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "name": "react-resizable-golden-browser", - "private": true, - "scripts": {"test": "node run.cjs"}, - "devDependencies": {"playwright": "1.62.1"} -} diff --git a/package.json b/package.json index cbe876c8..b87a754d 100644 --- a/package.json +++ b/package.json @@ -67,6 +67,7 @@ "jest": "^30.4.2", "jest-environment-jsdom": "^30.4.1", "lodash": "^4.18.1", + "playwright": "1.62.1", "pre-commit": "^1.1.2", "react": "^19.2.6", "react-dom": "^19.2.6", diff --git a/yarn.lock b/yarn.lock index 52fde601..b5e0e4b9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5455,6 +5455,16 @@ __metadata: languageName: node linkType: hard +"fsevents@npm:2.3.2": + version: 2.3.2 + resolution: "fsevents@npm:2.3.2" + dependencies: + node-gyp: "npm:latest" + checksum: 10c0/be78a3efa3e181cda3cf7a4637cb527bcebb0bd0ea0440105a3bb45b86f9245b307dc10a2507e8f4498a7d4ec349d1910f4d73e4d4495b16103106e07eee735b + conditions: os=darwin + languageName: node + linkType: hard + "fsevents@npm:^2.3.3, fsevents@npm:~2.3.2": version: 2.3.3 resolution: "fsevents@npm:2.3.3" @@ -5465,6 +5475,15 @@ __metadata: languageName: node linkType: hard +"fsevents@patch:fsevents@npm%3A2.3.2#optional!builtin": + version: 2.3.2 + resolution: "fsevents@patch:fsevents@npm%3A2.3.2#optional!builtin::version=2.3.2&hash=df0bf1" + dependencies: + node-gyp: "npm:latest" + conditions: os=darwin + languageName: node + linkType: hard + "fsevents@patch:fsevents@npm%3A^2.3.3#optional!builtin, fsevents@patch:fsevents@npm%3A~2.3.2#optional!builtin": version: 2.3.3 resolution: "fsevents@patch:fsevents@npm%3A2.3.3#optional!builtin::version=2.3.3&hash=df0bf1" @@ -7881,6 +7900,30 @@ __metadata: languageName: node linkType: hard +"playwright-core@npm:1.62.1": + version: 1.62.1 + resolution: "playwright-core@npm:1.62.1" + bin: + playwright-core: cli.js + checksum: 10c0/a37d0f03bb73364cfd0eba704c4b3359b609c4779ae2649a88d8e2b3a29c7357dfcc58bdcf0cb68ddffdef7687abf78902c8356e89f189682c7e19be38e108f0 + languageName: node + linkType: hard + +"playwright@npm:1.62.1": + version: 1.62.1 + resolution: "playwright@npm:1.62.1" + dependencies: + fsevents: "npm:2.3.2" + playwright-core: "npm:1.62.1" + dependenciesMeta: + fsevents: + optional: true + bin: + playwright: cli.js + checksum: 10c0/4d3522cd46325f50c46f8874d31f70d036f6983228a9f8b9d68fc249e4c17464edcd97cc4adfbb24e712d1829c1386d3bc24e17f58a1ced94e7c423300c21845 + languageName: node + linkType: hard + "possible-typed-array-names@npm:^1.0.0": version: 1.1.0 resolution: "possible-typed-array-names@npm:1.1.0" @@ -8184,6 +8227,7 @@ __metadata: jest: "npm:^30.4.2" jest-environment-jsdom: "npm:^30.4.1" lodash: "npm:^4.18.1" + playwright: "npm:1.62.1" pre-commit: "npm:^1.1.2" prop-types: "npm:15.x" react: "npm:^19.2.6" From e74b33d3f73983b4d0a5b9a0cc8f682668c8250b Mon Sep 17 00:00:00 2001 From: Samuel Reed Date: Sat, 31 Oct 2026 17:00:10 -0400 Subject: [PATCH 4/6] test: keep golden sentinels distinct from ordinary values Sentinels ({$undefined}, {$number}) are plain objects, so a trace value could change to a lookalike without changing its golden file, and value.map turned array holes into null. Ordinary objects with a "$" key are now wrapped in {$escaped}, and holes encode as {$hole: true}. Same fix as react-grid-layout#2320 round 1. No golden file changed; a new serializer test covers each collision. --- __tests__/golden/serialize.test.ts | 17 +++++++++++++++++ __tests__/golden/serialize.ts | 14 +++++++++++--- 2 files changed, 28 insertions(+), 3 deletions(-) create mode 100644 __tests__/golden/serialize.test.ts diff --git a/__tests__/golden/serialize.test.ts b/__tests__/golden/serialize.test.ts new file mode 100644 index 00000000..547da857 --- /dev/null +++ b/__tests__/golden/serialize.test.ts @@ -0,0 +1,17 @@ +import {serialize} from './serialize'; + +const trace = (step: unknown) => serialize({scenario: 'x', initial: null, steps: [step], final: null}); + +it('never encodes an ordinary object the same as a sentinel', () => { + const pairs: Array<[unknown, unknown]> = [ + [undefined, {$undefined: true}], + [Infinity, {$number: 'Infinity'}], + [-0, {$number: '-0'}], + [new Array(1), [{$hole: true}]], + [new Array(1), [null]], + [{$undefined: true}, {$escaped: {$undefined: true}}] + ]; + for (const [sentinel, lookalike] of pairs) { + expect(trace(sentinel)).not.toBe(trace(lookalike)); + } +}); diff --git a/__tests__/golden/serialize.ts b/__tests__/golden/serialize.ts index 4fec0a81..18fb0633 100644 --- a/__tests__/golden/serialize.ts +++ b/__tests__/golden/serialize.ts @@ -1,11 +1,19 @@ -// JSON stays valid, but values JSON normally loses retain their identity. +// JSON stays valid, but values JSON normally loses (undefined, NaN, +/-Infinity, +// -0, array holes) keep their identity. Ordinary objects with a "$" key are +// wrapped in {$escaped}, so none collides with a sentinel. export function stableValue(value: unknown): any { if (value === undefined) return {$undefined: true}; if (typeof value === 'number' && !Number.isFinite(value)) return {$number: String(value)}; if (Object.is(value, -0)) return {$number: '-0'}; - if (Array.isArray(value)) return value.map(stableValue); + if (Array.isArray(value)) { + return Array.from(value, (entry, i) => (i in value ? stableValue(entry) : {$hole: true})); + } if (value && typeof value === 'object') { - return Object.fromEntries(Object.keys(value).sort().map(key => [key, stableValue(value[key])])); + const keys = Object.keys(value).sort(); + const encoded = Object.fromEntries(keys.map(key => [key, stableValue(value[key])])); + // Sentinels are objects with a "$" key, so an ordinary object that has one is + // wrapped. That keeps undefined and {$undefined: true} distinct. + return keys.some(key => key.startsWith('$')) ? {$escaped: encoded} : encoded; } return value; } From bdcbb60cacf8d5e041ccd2cb92a423512bbfd627 Mon Sep 17 00:00:00 2001 From: Samuel Reed Date: Sat, 31 Oct 2026 17:15:22 -0400 Subject: [PATCH 5/6] test: pin every inline style and annotate browser parity failures in CI Review P2: the recorder kept only width and height from the box's style attribute, so a refactor that dropped a user's style (the fixture passes color: red) left every trace unchanged. Record all inline style properties, sorted. All 418 goldens regenerate with one style list each; nothing else moves. The browser cross-check failed on Linux CI while passing 42/42 locally, and the failing lines live only in the job log. On GitHub Actions the runner now also prints an ::error workflow command per failure, so the diff shows up as a check annotation. --- ...ndles-both-bottomright-batched.golden.json | 104 +++++++++--------- ...les-both-bottomright-per-event.golden.json | 88 +++++++-------- ...l-handles-both-topleft-batched.golden.json | 104 +++++++++--------- ...handles-both-topleft-per-event.golden.json | 88 +++++++-------- ...ndles-none-bottomright-batched.golden.json | 104 +++++++++--------- ...les-none-bottomright-per-event.golden.json | 88 +++++++-------- ...l-handles-none-topleft-batched.golden.json | 104 +++++++++--------- ...handles-none-topleft-per-event.golden.json | 88 +++++++-------- ...-handles-x-bottomright-batched.golden.json | 104 +++++++++--------- ...andles-x-bottomright-per-event.golden.json | 88 +++++++-------- ...-all-handles-x-topleft-batched.golden.json | 104 +++++++++--------- ...ll-handles-x-topleft-per-event.golden.json | 88 +++++++-------- ...-handles-y-bottomright-batched.golden.json | 104 +++++++++--------- ...andles-y-bottomright-per-event.golden.json | 88 +++++++-------- ...-all-handles-y-topleft-batched.golden.json | 104 +++++++++--------- ...ll-handles-y-topleft-per-event.golden.json | 88 +++++++-------- ...-max-binding-return-lock-false.golden.json | 20 ++-- ...s-max-binding-return-lock-true.golden.json | 20 ++-- ...nts-max-not-binding-lock-false.golden.json | 18 +-- ...ints-max-not-binding-lock-true.golden.json | 18 +-- ...-min-binding-return-lock-false.golden.json | 20 ++-- ...s-min-binding-return-lock-true.golden.json | 20 ++-- ...nts-min-not-binding-lock-false.golden.json | 18 +-- ...ints-min-not-binding-lock-true.golden.json | 18 +-- ...aints-tight-min-max-lock-false.golden.json | 20 ++-- ...raints-tight-min-max-lock-true.golden.json | 20 ++-- ...nstraints-unbounded-lock-false.golden.json | 18 +-- ...onstraints-unbounded-lock-true.golden.json | 18 +-- ...ble-e-both-bottomright-batched.golden.json | 20 ++-- ...e-e-both-bottomright-per-event.golden.json | 18 +-- ...sizable-e-both-topleft-batched.golden.json | 20 ++-- ...zable-e-both-topleft-per-event.golden.json | 18 +-- ...ble-e-none-bottomright-batched.golden.json | 20 ++-- ...e-e-none-bottomright-per-event.golden.json | 18 +-- ...sizable-e-none-topleft-batched.golden.json | 20 ++-- ...zable-e-none-topleft-per-event.golden.json | 18 +-- ...izable-e-x-bottomright-batched.golden.json | 20 ++-- ...able-e-x-bottomright-per-event.golden.json | 18 +-- .../Resizable-e-x-topleft-batched.golden.json | 20 ++-- ...esizable-e-x-topleft-per-event.golden.json | 18 +-- ...izable-e-y-bottomright-batched.golden.json | 20 ++-- ...able-e-y-bottomright-per-event.golden.json | 18 +-- .../Resizable-e-y-topleft-batched.golden.json | 20 ++-- ...esizable-e-y-topleft-per-event.golden.json | 18 +-- ...ble-n-both-bottomright-batched.golden.json | 20 ++-- ...e-n-both-bottomright-per-event.golden.json | 18 +-- ...sizable-n-both-topleft-batched.golden.json | 20 ++-- ...zable-n-both-topleft-per-event.golden.json | 18 +-- ...ble-n-none-bottomright-batched.golden.json | 20 ++-- ...e-n-none-bottomright-per-event.golden.json | 18 +-- ...sizable-n-none-topleft-batched.golden.json | 20 ++-- ...zable-n-none-topleft-per-event.golden.json | 18 +-- ...izable-n-x-bottomright-batched.golden.json | 20 ++-- ...able-n-x-bottomright-per-event.golden.json | 18 +-- .../Resizable-n-x-topleft-batched.golden.json | 20 ++-- ...esizable-n-x-topleft-per-event.golden.json | 18 +-- ...izable-n-y-bottomright-batched.golden.json | 20 ++-- ...able-n-y-bottomright-per-event.golden.json | 18 +-- .../Resizable-n-y-topleft-batched.golden.json | 20 ++-- ...esizable-n-y-topleft-per-event.golden.json | 18 +-- ...le-ne-both-bottomright-batched.golden.json | 20 ++-- ...-ne-both-bottomright-per-event.golden.json | 18 +-- ...izable-ne-both-topleft-batched.golden.json | 20 ++-- ...able-ne-both-topleft-per-event.golden.json | 18 +-- ...le-ne-none-bottomright-batched.golden.json | 20 ++-- ...-ne-none-bottomright-per-event.golden.json | 18 +-- ...izable-ne-none-topleft-batched.golden.json | 20 ++-- ...able-ne-none-topleft-per-event.golden.json | 18 +-- ...zable-ne-x-bottomright-batched.golden.json | 20 ++-- ...ble-ne-x-bottomright-per-event.golden.json | 18 +-- ...Resizable-ne-x-topleft-batched.golden.json | 20 ++-- ...sizable-ne-x-topleft-per-event.golden.json | 18 +-- ...zable-ne-y-bottomright-batched.golden.json | 20 ++-- ...ble-ne-y-bottomright-per-event.golden.json | 18 +-- ...Resizable-ne-y-topleft-batched.golden.json | 20 ++-- ...sizable-ne-y-topleft-per-event.golden.json | 18 +-- ...le-nw-both-bottomright-batched.golden.json | 20 ++-- ...-nw-both-bottomright-per-event.golden.json | 18 +-- ...izable-nw-both-topleft-batched.golden.json | 20 ++-- ...able-nw-both-topleft-per-event.golden.json | 18 +-- ...le-nw-none-bottomright-batched.golden.json | 20 ++-- ...-nw-none-bottomright-per-event.golden.json | 18 +-- ...izable-nw-none-topleft-batched.golden.json | 20 ++-- ...able-nw-none-topleft-per-event.golden.json | 18 +-- ...zable-nw-x-bottomright-batched.golden.json | 20 ++-- ...ble-nw-x-bottomright-per-event.golden.json | 18 +-- ...Resizable-nw-x-topleft-batched.golden.json | 20 ++-- ...sizable-nw-x-topleft-per-event.golden.json | 18 +-- ...zable-nw-y-bottomright-batched.golden.json | 20 ++-- ...ble-nw-y-bottomright-per-event.golden.json | 18 +-- ...Resizable-nw-y-topleft-batched.golden.json | 20 ++-- ...sizable-nw-y-topleft-per-event.golden.json | 18 +-- .../Resizable-options-0-0.golden.json | 18 +-- .../Resizable-options-0-1.golden.json | 20 ++-- .../Resizable-options-0-2.golden.json | 18 +-- .../Resizable-options-0-3.golden.json | 20 ++-- .../Resizable-options-1-0.golden.json | 18 +-- .../Resizable-options-1-1.golden.json | 20 ++-- .../Resizable-options-1-2.golden.json | 18 +-- .../Resizable-options-1-3.golden.json | 20 ++-- .../Resizable-options-2-0.golden.json | 20 ++-- .../Resizable-options-2-1.golden.json | 18 +-- .../Resizable-options-2-2.golden.json | 20 ++-- .../Resizable-options-2-3.golden.json | 18 +-- .../Resizable-options-3-0.golden.json | 20 ++-- .../Resizable-options-3-1.golden.json | 18 +-- .../Resizable-options-3-2.golden.json | 20 ++-- .../Resizable-options-3-3.golden.json | 18 +-- ...ble-s-both-bottomright-batched.golden.json | 20 ++-- ...e-s-both-bottomright-per-event.golden.json | 18 +-- ...sizable-s-both-topleft-batched.golden.json | 20 ++-- ...zable-s-both-topleft-per-event.golden.json | 18 +-- ...ble-s-none-bottomright-batched.golden.json | 20 ++-- ...e-s-none-bottomright-per-event.golden.json | 18 +-- ...sizable-s-none-topleft-batched.golden.json | 20 ++-- ...zable-s-none-topleft-per-event.golden.json | 18 +-- ...izable-s-x-bottomright-batched.golden.json | 20 ++-- ...able-s-x-bottomright-per-event.golden.json | 18 +-- .../Resizable-s-x-topleft-batched.golden.json | 20 ++-- ...esizable-s-x-topleft-per-event.golden.json | 18 +-- ...izable-s-y-bottomright-batched.golden.json | 20 ++-- ...able-s-y-bottomright-per-event.golden.json | 18 +-- .../Resizable-s-y-topleft-batched.golden.json | 20 ++-- ...esizable-s-y-topleft-per-event.golden.json | 18 +-- ...le-se-both-bottomright-batched.golden.json | 20 ++-- ...-se-both-bottomright-per-event.golden.json | 18 +-- ...izable-se-both-topleft-batched.golden.json | 20 ++-- ...able-se-both-topleft-per-event.golden.json | 18 +-- ...le-se-none-bottomright-batched.golden.json | 20 ++-- ...-se-none-bottomright-per-event.golden.json | 18 +-- ...izable-se-none-topleft-batched.golden.json | 20 ++-- ...able-se-none-topleft-per-event.golden.json | 18 +-- ...zable-se-x-bottomright-batched.golden.json | 20 ++-- ...ble-se-x-bottomright-per-event.golden.json | 18 +-- ...Resizable-se-x-topleft-batched.golden.json | 20 ++-- ...sizable-se-x-topleft-per-event.golden.json | 18 +-- ...zable-se-y-bottomright-batched.golden.json | 20 ++-- ...ble-se-y-bottomright-per-event.golden.json | 18 +-- ...Resizable-se-y-topleft-batched.golden.json | 20 ++-- ...sizable-se-y-topleft-per-event.golden.json | 18 +-- ...le-sw-both-bottomright-batched.golden.json | 20 ++-- ...-sw-both-bottomright-per-event.golden.json | 18 +-- ...izable-sw-both-topleft-batched.golden.json | 20 ++-- ...able-sw-both-topleft-per-event.golden.json | 18 +-- ...le-sw-none-bottomright-batched.golden.json | 20 ++-- ...-sw-none-bottomright-per-event.golden.json | 18 +-- ...izable-sw-none-topleft-batched.golden.json | 20 ++-- ...able-sw-none-topleft-per-event.golden.json | 18 +-- ...zable-sw-x-bottomright-batched.golden.json | 20 ++-- ...ble-sw-x-bottomright-per-event.golden.json | 18 +-- ...Resizable-sw-x-topleft-batched.golden.json | 20 ++-- ...sizable-sw-x-topleft-per-event.golden.json | 18 +-- ...zable-sw-y-bottomright-batched.golden.json | 20 ++-- ...ble-sw-y-bottomright-per-event.golden.json | 18 +-- ...Resizable-sw-y-topleft-batched.golden.json | 20 ++-- ...sizable-sw-y-topleft-per-event.golden.json | 18 +-- ...ble-w-both-bottomright-batched.golden.json | 20 ++-- ...e-w-both-bottomright-per-event.golden.json | 18 +-- ...sizable-w-both-topleft-batched.golden.json | 20 ++-- ...zable-w-both-topleft-per-event.golden.json | 18 +-- ...ble-w-none-bottomright-batched.golden.json | 20 ++-- ...e-w-none-bottomright-per-event.golden.json | 18 +-- ...sizable-w-none-topleft-batched.golden.json | 20 ++-- ...zable-w-none-topleft-per-event.golden.json | 18 +-- ...izable-w-x-bottomright-batched.golden.json | 20 ++-- ...able-w-x-bottomright-per-event.golden.json | 18 +-- .../Resizable-w-x-topleft-batched.golden.json | 20 ++-- ...esizable-w-x-topleft-per-event.golden.json | 18 +-- ...izable-w-y-bottomright-batched.golden.json | 20 ++-- ...able-w-y-bottomright-per-event.golden.json | 18 +-- .../Resizable-w-y-topleft-batched.golden.json | 20 ++-- ...esizable-w-y-topleft-per-event.golden.json | 18 +-- ...ndles-both-bottomright-batched.golden.json | 104 +++++++++--------- ...les-both-bottomright-per-event.golden.json | 88 +++++++-------- ...l-handles-both-topleft-batched.golden.json | 104 +++++++++--------- ...handles-both-topleft-per-event.golden.json | 88 +++++++-------- ...ndles-none-bottomright-batched.golden.json | 104 +++++++++--------- ...les-none-bottomright-per-event.golden.json | 88 +++++++-------- ...l-handles-none-topleft-batched.golden.json | 104 +++++++++--------- ...handles-none-topleft-per-event.golden.json | 88 +++++++-------- ...-handles-x-bottomright-batched.golden.json | 104 +++++++++--------- ...andles-x-bottomright-per-event.golden.json | 88 +++++++-------- ...-all-handles-x-topleft-batched.golden.json | 104 +++++++++--------- ...ll-handles-x-topleft-per-event.golden.json | 88 +++++++-------- ...-handles-y-bottomright-batched.golden.json | 104 +++++++++--------- ...andles-y-bottomright-per-event.golden.json | 88 +++++++-------- ...-all-handles-y-topleft-batched.golden.json | 104 +++++++++--------- ...ll-handles-y-topleft-per-event.golden.json | 88 +++++++-------- ...-max-binding-return-lock-false.golden.json | 20 ++-- ...s-max-binding-return-lock-true.golden.json | 20 ++-- ...nts-max-not-binding-lock-false.golden.json | 18 +-- ...ints-max-not-binding-lock-true.golden.json | 18 +-- ...-min-binding-return-lock-false.golden.json | 20 ++-- ...s-min-binding-return-lock-true.golden.json | 20 ++-- ...nts-min-not-binding-lock-false.golden.json | 18 +-- ...ints-min-not-binding-lock-true.golden.json | 18 +-- ...aints-tight-min-max-lock-false.golden.json | 20 ++-- ...raints-tight-min-max-lock-true.golden.json | 20 ++-- ...nstraints-unbounded-lock-false.golden.json | 18 +-- ...onstraints-unbounded-lock-true.golden.json | 18 +-- ...Box-e-both-bottomright-batched.golden.json | 20 ++-- ...x-e-both-bottomright-per-event.golden.json | 18 +-- ...ableBox-e-both-topleft-batched.golden.json | 20 ++-- ...leBox-e-both-topleft-per-event.golden.json | 18 +-- ...Box-e-none-bottomright-batched.golden.json | 20 ++-- ...x-e-none-bottomright-per-event.golden.json | 18 +-- ...ableBox-e-none-topleft-batched.golden.json | 20 ++-- ...leBox-e-none-topleft-per-event.golden.json | 18 +-- ...bleBox-e-x-bottomright-batched.golden.json | 20 ++-- ...eBox-e-x-bottomright-per-event.golden.json | 18 +-- ...sizableBox-e-x-topleft-batched.golden.json | 20 ++-- ...zableBox-e-x-topleft-per-event.golden.json | 18 +-- ...bleBox-e-y-bottomright-batched.golden.json | 20 ++-- ...eBox-e-y-bottomright-per-event.golden.json | 18 +-- ...sizableBox-e-y-topleft-batched.golden.json | 20 ++-- ...zableBox-e-y-topleft-per-event.golden.json | 18 +-- ...Box-n-both-bottomright-batched.golden.json | 20 ++-- ...x-n-both-bottomright-per-event.golden.json | 18 +-- ...ableBox-n-both-topleft-batched.golden.json | 20 ++-- ...leBox-n-both-topleft-per-event.golden.json | 18 +-- ...Box-n-none-bottomright-batched.golden.json | 20 ++-- ...x-n-none-bottomright-per-event.golden.json | 18 +-- ...ableBox-n-none-topleft-batched.golden.json | 20 ++-- ...leBox-n-none-topleft-per-event.golden.json | 18 +-- ...bleBox-n-x-bottomright-batched.golden.json | 20 ++-- ...eBox-n-x-bottomright-per-event.golden.json | 18 +-- ...sizableBox-n-x-topleft-batched.golden.json | 20 ++-- ...zableBox-n-x-topleft-per-event.golden.json | 18 +-- ...bleBox-n-y-bottomright-batched.golden.json | 20 ++-- ...eBox-n-y-bottomright-per-event.golden.json | 18 +-- ...sizableBox-n-y-topleft-batched.golden.json | 20 ++-- ...zableBox-n-y-topleft-per-event.golden.json | 18 +-- ...ox-ne-both-bottomright-batched.golden.json | 20 ++-- ...-ne-both-bottomright-per-event.golden.json | 18 +-- ...bleBox-ne-both-topleft-batched.golden.json | 20 ++-- ...eBox-ne-both-topleft-per-event.golden.json | 18 +-- ...ox-ne-none-bottomright-batched.golden.json | 20 ++-- ...-ne-none-bottomright-per-event.golden.json | 18 +-- ...bleBox-ne-none-topleft-batched.golden.json | 20 ++-- ...eBox-ne-none-topleft-per-event.golden.json | 18 +-- ...leBox-ne-x-bottomright-batched.golden.json | 20 ++-- ...Box-ne-x-bottomright-per-event.golden.json | 18 +-- ...izableBox-ne-x-topleft-batched.golden.json | 20 ++-- ...ableBox-ne-x-topleft-per-event.golden.json | 18 +-- ...leBox-ne-y-bottomright-batched.golden.json | 20 ++-- ...Box-ne-y-bottomright-per-event.golden.json | 18 +-- ...izableBox-ne-y-topleft-batched.golden.json | 20 ++-- ...ableBox-ne-y-topleft-per-event.golden.json | 18 +-- ...ox-nw-both-bottomright-batched.golden.json | 20 ++-- ...-nw-both-bottomright-per-event.golden.json | 18 +-- ...bleBox-nw-both-topleft-batched.golden.json | 20 ++-- ...eBox-nw-both-topleft-per-event.golden.json | 18 +-- ...ox-nw-none-bottomright-batched.golden.json | 20 ++-- ...-nw-none-bottomright-per-event.golden.json | 18 +-- ...bleBox-nw-none-topleft-batched.golden.json | 20 ++-- ...eBox-nw-none-topleft-per-event.golden.json | 18 +-- ...leBox-nw-x-bottomright-batched.golden.json | 20 ++-- ...Box-nw-x-bottomright-per-event.golden.json | 18 +-- ...izableBox-nw-x-topleft-batched.golden.json | 20 ++-- ...ableBox-nw-x-topleft-per-event.golden.json | 18 +-- ...leBox-nw-y-bottomright-batched.golden.json | 20 ++-- ...Box-nw-y-bottomright-per-event.golden.json | 18 +-- ...izableBox-nw-y-topleft-batched.golden.json | 20 ++-- ...ableBox-nw-y-topleft-per-event.golden.json | 18 +-- .../ResizableBox-options-0-0.golden.json | 18 +-- .../ResizableBox-options-0-1.golden.json | 20 ++-- .../ResizableBox-options-0-2.golden.json | 18 +-- .../ResizableBox-options-0-3.golden.json | 20 ++-- .../ResizableBox-options-1-0.golden.json | 18 +-- .../ResizableBox-options-1-1.golden.json | 20 ++-- .../ResizableBox-options-1-2.golden.json | 18 +-- .../ResizableBox-options-1-3.golden.json | 20 ++-- .../ResizableBox-options-2-0.golden.json | 20 ++-- .../ResizableBox-options-2-1.golden.json | 18 +-- .../ResizableBox-options-2-2.golden.json | 20 ++-- .../ResizableBox-options-2-3.golden.json | 18 +-- .../ResizableBox-options-3-0.golden.json | 20 ++-- .../ResizableBox-options-3-1.golden.json | 18 +-- .../ResizableBox-options-3-2.golden.json | 20 ++-- .../ResizableBox-options-3-3.golden.json | 18 +-- ...Box-s-both-bottomright-batched.golden.json | 20 ++-- ...x-s-both-bottomright-per-event.golden.json | 18 +-- ...ableBox-s-both-topleft-batched.golden.json | 20 ++-- ...leBox-s-both-topleft-per-event.golden.json | 18 +-- ...Box-s-none-bottomright-batched.golden.json | 20 ++-- ...x-s-none-bottomright-per-event.golden.json | 18 +-- ...ableBox-s-none-topleft-batched.golden.json | 20 ++-- ...leBox-s-none-topleft-per-event.golden.json | 18 +-- ...bleBox-s-x-bottomright-batched.golden.json | 20 ++-- ...eBox-s-x-bottomright-per-event.golden.json | 18 +-- ...sizableBox-s-x-topleft-batched.golden.json | 20 ++-- ...zableBox-s-x-topleft-per-event.golden.json | 18 +-- ...bleBox-s-y-bottomright-batched.golden.json | 20 ++-- ...eBox-s-y-bottomright-per-event.golden.json | 18 +-- ...sizableBox-s-y-topleft-batched.golden.json | 20 ++-- ...zableBox-s-y-topleft-per-event.golden.json | 18 +-- ...ox-se-both-bottomright-batched.golden.json | 20 ++-- ...-se-both-bottomright-per-event.golden.json | 18 +-- ...bleBox-se-both-topleft-batched.golden.json | 20 ++-- ...eBox-se-both-topleft-per-event.golden.json | 18 +-- ...ox-se-none-bottomright-batched.golden.json | 20 ++-- ...-se-none-bottomright-per-event.golden.json | 18 +-- ...bleBox-se-none-topleft-batched.golden.json | 20 ++-- ...eBox-se-none-topleft-per-event.golden.json | 18 +-- ...leBox-se-x-bottomright-batched.golden.json | 20 ++-- ...Box-se-x-bottomright-per-event.golden.json | 18 +-- ...izableBox-se-x-topleft-batched.golden.json | 20 ++-- ...ableBox-se-x-topleft-per-event.golden.json | 18 +-- ...leBox-se-y-bottomright-batched.golden.json | 20 ++-- ...Box-se-y-bottomright-per-event.golden.json | 18 +-- ...izableBox-se-y-topleft-batched.golden.json | 20 ++-- ...ableBox-se-y-topleft-per-event.golden.json | 18 +-- ...ox-sw-both-bottomright-batched.golden.json | 20 ++-- ...-sw-both-bottomright-per-event.golden.json | 18 +-- ...bleBox-sw-both-topleft-batched.golden.json | 20 ++-- ...eBox-sw-both-topleft-per-event.golden.json | 18 +-- ...ox-sw-none-bottomright-batched.golden.json | 20 ++-- ...-sw-none-bottomright-per-event.golden.json | 18 +-- ...bleBox-sw-none-topleft-batched.golden.json | 20 ++-- ...eBox-sw-none-topleft-per-event.golden.json | 18 +-- ...leBox-sw-x-bottomright-batched.golden.json | 20 ++-- ...Box-sw-x-bottomright-per-event.golden.json | 18 +-- ...izableBox-sw-x-topleft-batched.golden.json | 20 ++-- ...ableBox-sw-x-topleft-per-event.golden.json | 18 +-- ...leBox-sw-y-bottomright-batched.golden.json | 20 ++-- ...Box-sw-y-bottomright-per-event.golden.json | 18 +-- ...izableBox-sw-y-topleft-batched.golden.json | 20 ++-- ...ableBox-sw-y-topleft-per-event.golden.json | 18 +-- ...Box-w-both-bottomright-batched.golden.json | 20 ++-- ...x-w-both-bottomright-per-event.golden.json | 18 +-- ...ableBox-w-both-topleft-batched.golden.json | 20 ++-- ...leBox-w-both-topleft-per-event.golden.json | 18 +-- ...Box-w-none-bottomright-batched.golden.json | 20 ++-- ...x-w-none-bottomright-per-event.golden.json | 18 +-- ...ableBox-w-none-topleft-batched.golden.json | 20 ++-- ...leBox-w-none-topleft-per-event.golden.json | 18 +-- ...bleBox-w-x-bottomright-batched.golden.json | 20 ++-- ...eBox-w-x-bottomright-per-event.golden.json | 18 +-- ...sizableBox-w-x-topleft-batched.golden.json | 20 ++-- ...zableBox-w-x-topleft-per-event.golden.json | 18 +-- ...bleBox-w-y-bottomright-batched.golden.json | 20 ++-- ...eBox-w-y-bottomright-per-event.golden.json | 18 +-- ...sizableBox-w-y-topleft-batched.golden.json | 20 ++-- ...zableBox-w-y-topleft-per-event.golden.json | 18 +-- .../box-cadence-B-stale-props-255.golden.json | 20 ++-- ...rowser-Resizable-e-bottomright.golden.json | 18 +-- .../browser-Resizable-e-topleft.golden.json | 18 +-- ...rowser-Resizable-n-bottomright.golden.json | 18 +-- .../browser-Resizable-n-topleft.golden.json | 18 +-- ...owser-Resizable-ne-bottomright.golden.json | 18 +-- .../browser-Resizable-ne-topleft.golden.json | 18 +-- ...owser-Resizable-nw-bottomright.golden.json | 18 +-- .../browser-Resizable-nw-topleft.golden.json | 18 +-- ...rowser-Resizable-s-bottomright.golden.json | 18 +-- .../browser-Resizable-s-topleft.golden.json | 18 +-- ...owser-Resizable-se-bottomright.golden.json | 18 +-- .../browser-Resizable-se-topleft.golden.json | 18 +-- ...owser-Resizable-sw-bottomright.golden.json | 18 +-- .../browser-Resizable-sw-topleft.golden.json | 18 +-- ...rowser-Resizable-w-bottomright.golden.json | 18 +-- .../browser-Resizable-w-topleft.golden.json | 18 +-- ...ser-ResizableBox-e-bottomright.golden.json | 18 +-- ...browser-ResizableBox-e-topleft.golden.json | 18 +-- ...ser-ResizableBox-n-bottomright.golden.json | 18 +-- ...browser-ResizableBox-n-topleft.golden.json | 18 +-- ...er-ResizableBox-ne-bottomright.golden.json | 18 +-- ...rowser-ResizableBox-ne-topleft.golden.json | 18 +-- ...er-ResizableBox-nw-bottomright.golden.json | 18 +-- ...rowser-ResizableBox-nw-topleft.golden.json | 18 +-- ...ser-ResizableBox-s-bottomright.golden.json | 18 +-- ...browser-ResizableBox-s-topleft.golden.json | 18 +-- ...er-ResizableBox-se-bottomright.golden.json | 18 +-- ...rowser-ResizableBox-se-topleft.golden.json | 18 +-- ...er-ResizableBox-sw-bottomright.golden.json | 18 +-- ...rowser-ResizableBox-sw-topleft.golden.json | 18 +-- ...ser-ResizableBox-w-bottomright.golden.json | 18 +-- ...browser-ResizableBox-w-topleft.golden.json | 18 +-- .../browser-controlled-frozen.golden.json | 18 +-- .../browser-grid-relative-deltas.golden.json | 20 ++-- .../browser-known-lock-axis-x.golden.json | 14 +-- .../browser-known-mouseup-delta.golden.json | 14 +-- .../browser-lock-max-binding.golden.json | 14 +-- .../browser-scale-0.5-nw.golden.json | 18 +-- .../browser-scale-0.5-se.golden.json | 18 +-- .../__golden__/browser-scale-2-nw.golden.json | 18 +-- .../__golden__/browser-scale-2-se.golden.json | 18 +-- .../__golden__/browser-strict-box.golden.json | 88 +++++++-------- .../cadence-B-stale-props-255.golden.json | 22 ++-- .../callback-false-is-ignored.golden.json | 18 +-- .../__golden__/controlled-clamp.golden.json | 18 +-- .../__golden__/controlled-frozen.golden.json | 18 +-- .../__golden__/draggable-cancel.golden.json | 18 +-- .../__golden__/draggable-disabled.golden.json | 18 +-- .../draggable-double-scale.golden.json | 18 +-- .../draggable-handle-selector.golden.json | 18 +-- .../draggable-no-user-select.golden.json | 18 +-- .../grid-relative-deltas.golden.json | 20 ++-- .../__golden__/handle-size-large.golden.json | 18 +-- .../__golden__/handle-size-small.golden.json | 18 +-- ...known-aspect-max-drift-batched.golden.json | 20 ++-- .../known-aspect-max-drift.golden.json | 18 +-- .../__golden__/known-axis-none.golden.json | 18 +-- .../known-box-missing-width.golden.json | 18 +-- .../known-box-resize-after-stop.golden.json | 20 ++-- ...draggable-handlers-overwritten.golden.json | 18 +-- .../known-element-ref-overwritten.golden.json | 18 +-- .../known-function-without-ref.golden.json | 18 +-- .../known-incompatible-axis.golden.json | 18 +-- .../__golden__/known-lock-axis-x.golden.json | 14 +-- .../known-lock-zero-height.golden.json | 18 +-- .../known-mouseup-delta.golden.json | 14 +-- .../__golden__/known-scale-zero.golden.json | 18 +-- .../known-start-constrained.golden.json | 16 +-- .../golden/__golden__/strict-box.golden.json | 88 +++++++-------- .../__golden__/strict-resizable.golden.json | 88 +++++++-------- .../touch-nw-moving-layout.golden.json | 18 +-- .../__golden__/unmount-mouse.golden.json | 8 +- .../__golden__/unmount-touch.golden.json | 8 +- __tests__/golden/browser/run.cjs | 11 ++ __tests__/golden/recorder.ts | 4 +- 420 files changed, 5271 insertions(+), 5258 deletions(-) diff --git a/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-batched.golden.json index 133f8325..efe17a6d 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-per-event.golden.json index 9c7af729..552bfa65 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-both-bottomright-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"170px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"180px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"260px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"270px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"290px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"310px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"350px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"360px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","170px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","180px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","200px"],["width","200px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","210px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","260px"],["width","230px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","270px"],["width","240px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","290px"],["width","260px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","310px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","350px"],["width","320px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","360px"],["width","340px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-batched.golden.json index c0d17fb8..cd9ba58e 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-per-event.golden.json index 301f8abd..604435a3 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-both-topleft-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"150px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"140px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"150px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"170px","tag":"div","width":"170px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"180px","tag":"div","width":"180px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"210px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"230px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"240px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"260px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"270px","tag":"div","width":"270px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","150px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","140px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","150px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","170px"],["width","170px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","180px"],["width","180px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","200px"],["width","200px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","210px"],["width","210px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","230px"],["width","230px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","240px"],["width","240px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","260px"],["width","260px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","270px"],["width","270px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-batched.golden.json index 8719995a..bf315ff8 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-per-event.golden.json index 182113c6..6da3b0a4 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-none-bottomright-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-batched.golden.json index c0a44447..7ec5e0da 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-per-event.golden.json index ed18ecfe..4f3950d3 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-none-topleft-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-batched.golden.json index ceecc405..5aa0d4ae 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-per-event.golden.json index 6e5862d4..3006e74e 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-x-bottomright-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","200px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","210px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","230px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","240px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","260px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","320px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","340px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-batched.golden.json index d08dc05a..cef89361 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-per-event.golden.json index 01238152..0951dddd 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-x-topleft-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"150px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"170px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"180px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"270px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","150px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","170px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","180px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","200px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","210px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","230px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","240px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","260px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","270px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-batched.golden.json index 317e2ca1..2ca37dc3 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-per-event.golden.json index 3aabc45c..24c57b19 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-y-bottomright-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"170px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"180px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"200px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"260px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"270px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"290px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"310px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"350px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"360px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","170px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","180px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","200px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","260px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","270px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","290px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","310px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","340px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","340px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","340px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","350px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","360px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","370px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","370px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","370px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","370px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-batched.golden.json index 2abd5e7f..e85f270b 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-per-event.golden.json index 0f4c57bf..411ac06f 100644 --- a/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-all-handles-y-topleft-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-all-handles-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"140px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"150px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"170px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"180px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"200px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"210px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"230px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"240px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"260px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"270px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","140px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","150px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","170px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","180px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","200px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","210px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","230px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","240px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","260px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","270px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-false.golden.json b/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-false.golden.json index 3e7e049c..e647e4ce 100644 --- a/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-false.golden.json +++ b/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-false.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[120,115],"min":null,"mode":"follow","name":"Resizable-constraints-max-binding-return-lock-false","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-true.golden.json b/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-true.golden.json index dddb9ba8..558049fa 100644 --- a/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-true.golden.json +++ b/__tests__/golden/__golden__/Resizable-constraints-max-binding-return-lock-true.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":[120,115],"min":null,"mode":"follow","name":"Resizable-constraints-max-binding-return-lock-true","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":111.09502262443442,"width":108.53393665158374}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"111.09502262443442px","tag":"div","width":"108.53393665158374px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90.86455419266944,"width":88.76984346958983}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90.86455419266944,"width":88.76984346958983}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":111.09502262443442,"width":108.53393665158374}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","111.09502262443442px"],["width","108.53393665158374px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90.86455419266944,"width":88.76984346958983}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90.86455419266944px"],["width","88.76984346958983px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90.86455419266944,"width":88.76984346958983}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90.86455419266944px"],["width","88.76984346958983px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90.86455419266944px"],["width","88.76984346958983px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90.86455419266944px"],["width","88.76984346958983px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-false.golden.json b/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-false.golden.json index 29bcc629..37e62d1a 100644 --- a/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-false.golden.json +++ b/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-false.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[1000,1000],"min":null,"mode":"follow","name":"Resizable-constraints-max-not-binding-lock-false","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-true.golden.json b/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-true.golden.json index 4b8a7849..43ba364f 100644 --- a/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-true.golden.json +++ b/__tests__/golden/__golden__/Resizable-constraints-max-not-binding-lock-true.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":[1000,1000],"min":null,"mode":"follow","name":"Resizable-constraints-max-not-binding-lock-true","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-false.golden.json b/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-false.golden.json index f24c7e26..b74e6919 100644 --- a/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-false.golden.json +++ b/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-false.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":null,"min":[80,70],"mode":"follow","name":"Resizable-constraints-min-binding-return-lock-false","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":80,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"80px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":80,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","80px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-true.golden.json b/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-true.golden.json index aae60d38..ed3956d9 100644 --- a/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-true.golden.json +++ b/__tests__/golden/__golden__/Resizable-constraints-min-binding-return-lock-true.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":null,"min":[80,70],"mode":"follow","name":"Resizable-constraints-min-binding-return-lock-true","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":74.33628318584073,"width":84.9557522123894}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"74.33628318584073px","tag":"div","width":"84.9557522123894px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.21238938053101,"width":116.81415929203543}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.21238938053101,"width":116.81415929203543}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":74.33628318584073,"width":84.9557522123894}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","74.33628318584073px"],["width","84.9557522123894px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.21238938053101,"width":116.81415929203543}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","102.21238938053101px"],["width","116.81415929203543px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.21238938053101,"width":116.81415929203543}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","102.21238938053101px"],["width","116.81415929203543px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","102.21238938053101px"],["width","116.81415929203543px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","102.21238938053101px"],["width","116.81415929203543px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-false.golden.json b/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-false.golden.json index cdf5031a..bfccfb48 100644 --- a/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-false.golden.json +++ b/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-false.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":null,"min":[20,20],"mode":"follow","name":"Resizable-constraints-min-not-binding-lock-false","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-true.golden.json b/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-true.golden.json index 20d03cfd..b49a9cae 100644 --- a/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-true.golden.json +++ b/__tests__/golden/__golden__/Resizable-constraints-min-not-binding-lock-true.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":null,"min":[20,20],"mode":"follow","name":"Resizable-constraints-min-not-binding-lock-true","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-false.golden.json b/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-false.golden.json index 655dea0c..a27b2a5e 100644 --- a/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-false.golden.json +++ b/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-false.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[110,110],"min":[90,90],"mode":"follow","name":"Resizable-constraints-tight-min-max-lock-false","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-true.golden.json b/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-true.golden.json index 9fdbc190..a59886d0 100644 --- a/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-true.golden.json +++ b/__tests__/golden/__golden__/Resizable-constraints-tight-min-max-lock-true.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":[110,110],"min":[90,90],"mode":"follow","name":"Resizable-constraints-tight-min-max-lock-true","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-false.golden.json b/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-false.golden.json index 936b2bb2..2963bc6e 100644 --- a/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-false.golden.json +++ b/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-false.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":null,"min":null,"mode":"follow","name":"Resizable-constraints-unbounded-lock-false","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-true.golden.json b/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-true.golden.json index 5c32d46c..309148a7 100644 --- a/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-true.golden.json +++ b/__tests__/golden/__golden__/Resizable-constraints-unbounded-lock-true.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":null,"min":null,"mode":"follow","name":"Resizable-constraints-unbounded-lock-true","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-both-bottomright-batched.golden.json index 25e41743..25796cc4 100644 --- a/__tests__/golden/__golden__/Resizable-e-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-both-bottomright-per-event.golden.json index 677a5062..77065b99 100644 --- a/__tests__/golden/__golden__/Resizable-e-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-both-topleft-batched.golden.json index b98bcc01..eb7cab5f 100644 --- a/__tests__/golden/__golden__/Resizable-e-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-both-topleft-per-event.golden.json index b698c99e..fb976733 100644 --- a/__tests__/golden/__golden__/Resizable-e-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-none-bottomright-batched.golden.json index b837da0a..478df6fb 100644 --- a/__tests__/golden/__golden__/Resizable-e-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-none-bottomright-per-event.golden.json index db9622f7..31bdea6c 100644 --- a/__tests__/golden/__golden__/Resizable-e-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-none-topleft-batched.golden.json index d6fb9ef8..568a090f 100644 --- a/__tests__/golden/__golden__/Resizable-e-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-none-topleft-per-event.golden.json index 571f934f..097aca8d 100644 --- a/__tests__/golden/__golden__/Resizable-e-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-x-bottomright-batched.golden.json index c2e7ce83..106153c9 100644 --- a/__tests__/golden/__golden__/Resizable-e-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-x-bottomright-per-event.golden.json index 1b552617..23ac5b51 100644 --- a/__tests__/golden/__golden__/Resizable-e-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-x-topleft-batched.golden.json index e13cd52a..345e8467 100644 --- a/__tests__/golden/__golden__/Resizable-e-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-x-topleft-per-event.golden.json index f4da28c3..3707508c 100644 --- a/__tests__/golden/__golden__/Resizable-e-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-y-bottomright-batched.golden.json index fb5ede20..4a92b73d 100644 --- a/__tests__/golden/__golden__/Resizable-e-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-y-bottomright-per-event.golden.json index 0ef2eb03..dda38272 100644 --- a/__tests__/golden/__golden__/Resizable-e-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-e-y-topleft-batched.golden.json index c77def28..7d854004 100644 --- a/__tests__/golden/__golden__/Resizable-e-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-e-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-e-y-topleft-per-event.golden.json index 188e45ef..067d4b90 100644 --- a/__tests__/golden/__golden__/Resizable-e-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-e-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-e-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-both-bottomright-batched.golden.json index 8386ba8c..d050d7c2 100644 --- a/__tests__/golden/__golden__/Resizable-n-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-both-bottomright-per-event.golden.json index 47aee515..124ceedc 100644 --- a/__tests__/golden/__golden__/Resizable-n-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-both-topleft-batched.golden.json index 566b505d..b331eaf5 100644 --- a/__tests__/golden/__golden__/Resizable-n-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-both-topleft-per-event.golden.json index 5e345d25..37287c2b 100644 --- a/__tests__/golden/__golden__/Resizable-n-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-none-bottomright-batched.golden.json index 43fa9e63..5e213530 100644 --- a/__tests__/golden/__golden__/Resizable-n-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-none-bottomright-per-event.golden.json index 74c5b85c..5c0c4ecf 100644 --- a/__tests__/golden/__golden__/Resizable-n-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-none-topleft-batched.golden.json index 8f222474..dd176c34 100644 --- a/__tests__/golden/__golden__/Resizable-n-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-none-topleft-per-event.golden.json index 3ae6545e..dd4c0efe 100644 --- a/__tests__/golden/__golden__/Resizable-n-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-x-bottomright-batched.golden.json index de1d0154..91a19a57 100644 --- a/__tests__/golden/__golden__/Resizable-n-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-x-bottomright-per-event.golden.json index 629aa09b..62a8b0e6 100644 --- a/__tests__/golden/__golden__/Resizable-n-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-x-topleft-batched.golden.json index 449eef60..1c77bb0c 100644 --- a/__tests__/golden/__golden__/Resizable-n-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-x-topleft-per-event.golden.json index 4088624f..9b1babce 100644 --- a/__tests__/golden/__golden__/Resizable-n-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-y-bottomright-batched.golden.json index eeeaf9da..625f436e 100644 --- a/__tests__/golden/__golden__/Resizable-n-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-y-bottomright-per-event.golden.json index 61851860..0d116ffa 100644 --- a/__tests__/golden/__golden__/Resizable-n-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-n-y-topleft-batched.golden.json index 5ca2c5d0..a5f57bb4 100644 --- a/__tests__/golden/__golden__/Resizable-n-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-n-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-n-y-topleft-per-event.golden.json index ada07839..0efeee85 100644 --- a/__tests__/golden/__golden__/Resizable-n-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-n-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-n-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-both-bottomright-batched.golden.json index b97a0069..df81c77b 100644 --- a/__tests__/golden/__golden__/Resizable-ne-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-both-bottomright-per-event.golden.json index 94f8f9fd..8916cc94 100644 --- a/__tests__/golden/__golden__/Resizable-ne-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-both-topleft-batched.golden.json index dcca0a6f..96ed3146 100644 --- a/__tests__/golden/__golden__/Resizable-ne-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-both-topleft-per-event.golden.json index cf72f775..97761ae3 100644 --- a/__tests__/golden/__golden__/Resizable-ne-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-none-bottomright-batched.golden.json index 53f55fc6..b48c0711 100644 --- a/__tests__/golden/__golden__/Resizable-ne-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-none-bottomright-per-event.golden.json index b89ec547..a40c6fab 100644 --- a/__tests__/golden/__golden__/Resizable-ne-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-none-topleft-batched.golden.json index faf271b8..9aa56a8d 100644 --- a/__tests__/golden/__golden__/Resizable-ne-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-none-topleft-per-event.golden.json index b7baf69c..cf96e2a9 100644 --- a/__tests__/golden/__golden__/Resizable-ne-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-x-bottomright-batched.golden.json index 73206568..94d0ae7e 100644 --- a/__tests__/golden/__golden__/Resizable-ne-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-x-bottomright-per-event.golden.json index 5f3d96a9..731fba16 100644 --- a/__tests__/golden/__golden__/Resizable-ne-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-x-topleft-batched.golden.json index 92284246..7266acb1 100644 --- a/__tests__/golden/__golden__/Resizable-ne-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-x-topleft-per-event.golden.json index 6827dae7..8188caa9 100644 --- a/__tests__/golden/__golden__/Resizable-ne-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-y-bottomright-batched.golden.json index f01b291e..221e8d80 100644 --- a/__tests__/golden/__golden__/Resizable-ne-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-y-bottomright-per-event.golden.json index ff475581..622adbab 100644 --- a/__tests__/golden/__golden__/Resizable-ne-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-ne-y-topleft-batched.golden.json index 7ff5c6de..bad43569 100644 --- a/__tests__/golden/__golden__/Resizable-ne-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-ne-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-ne-y-topleft-per-event.golden.json index 43f64c94..e4818fb8 100644 --- a/__tests__/golden/__golden__/Resizable-ne-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-ne-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-ne-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-both-bottomright-batched.golden.json index dc5d9f0d..54e328a4 100644 --- a/__tests__/golden/__golden__/Resizable-nw-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-both-bottomright-per-event.golden.json index 62cfbbd7..e76af11a 100644 --- a/__tests__/golden/__golden__/Resizable-nw-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-both-topleft-batched.golden.json index 6fb97d27..b6b69420 100644 --- a/__tests__/golden/__golden__/Resizable-nw-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-both-topleft-per-event.golden.json index c710b4f4..043353cc 100644 --- a/__tests__/golden/__golden__/Resizable-nw-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-none-bottomright-batched.golden.json index 89c1df86..eb24bad5 100644 --- a/__tests__/golden/__golden__/Resizable-nw-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-none-bottomright-per-event.golden.json index a6dfaae6..e4bf76d8 100644 --- a/__tests__/golden/__golden__/Resizable-nw-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-none-topleft-batched.golden.json index d86c6e8a..bed01b18 100644 --- a/__tests__/golden/__golden__/Resizable-nw-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-none-topleft-per-event.golden.json index 254a7933..938ce1a1 100644 --- a/__tests__/golden/__golden__/Resizable-nw-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-x-bottomright-batched.golden.json index 07c27208..04f175a9 100644 --- a/__tests__/golden/__golden__/Resizable-nw-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-x-bottomright-per-event.golden.json index a6ee4768..ddc8bcec 100644 --- a/__tests__/golden/__golden__/Resizable-nw-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-x-topleft-batched.golden.json index 82b01d25..0136e605 100644 --- a/__tests__/golden/__golden__/Resizable-nw-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-x-topleft-per-event.golden.json index bd176197..32ad56a5 100644 --- a/__tests__/golden/__golden__/Resizable-nw-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-y-bottomright-batched.golden.json index 946e169b..7e89ecf0 100644 --- a/__tests__/golden/__golden__/Resizable-nw-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-y-bottomright-per-event.golden.json index 21fdc17d..8e75a9dd 100644 --- a/__tests__/golden/__golden__/Resizable-nw-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-nw-y-topleft-batched.golden.json index d1e0af54..877b93d4 100644 --- a/__tests__/golden/__golden__/Resizable-nw-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-nw-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-nw-y-topleft-per-event.golden.json index 06ff79c2..acef4112 100644 --- a/__tests__/golden/__golden__/Resizable-nw-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-nw-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-nw-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-0-0.golden.json b/__tests__/golden/__golden__/Resizable-options-0-0.golden.json index 2014aad3..de9cd79c 100644 --- a/__tests__/golden/__golden__/Resizable-options-0-0.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-0-0.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":true,"max":null,"min":null,"mode":"follow","name":"Resizable-options-0-0","opts":{},"pointer":"touch","points":[[10,10],[20,20],[30,30]],"scale":0.5,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-0-1.golden.json b/__tests__/golden/__golden__/Resizable-options-0-1.golden.json index 104abd2a..c29285ef 100644 --- a/__tests__/golden/__golden__/Resizable-options-0-1.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-0-1.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":null,"min":[80,70],"mode":"frozen","name":"Resizable-options-0-1","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-0-2.golden.json b/__tests__/golden/__golden__/Resizable-options-0-2.golden.json index f16f84b4..ac4abf3c 100644 --- a/__tests__/golden/__golden__/Resizable-options-0-2.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-0-2.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":true,"max":[120,115],"min":[80,70],"mode":"clamp","name":"Resizable-options-0-2","opts":{},"pointer":"touch","points":[[10,10],[20,20],[30,30]],"scale":2,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","105px"],["width","105px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","107.5px"],["width","107.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","107.5px"],["width","107.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","107.5px"],["width","107.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","107.5px"],["width","107.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-0-3.golden.json b/__tests__/golden/__golden__/Resizable-options-0-3.golden.json index fa6372af..de936621 100644 --- a/__tests__/golden/__golden__/Resizable-options-0-3.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-0-3.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[120,115],"min":[80,70],"mode":"follow","name":"Resizable-options-0-3","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":115,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":115,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-1-0.golden.json b/__tests__/golden/__golden__/Resizable-options-1-0.golden.json index c1b57cbe..73ec7184 100644 --- a/__tests__/golden/__golden__/Resizable-options-1-0.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-1-0.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"element","lock":false,"max":null,"min":[80,70],"mode":"follow","name":"Resizable-options-1-0","opts":{},"pointer":"touch","points":[[10,5],[10,5],[0,0]],"scale":0.5,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-1-1.golden.json b/__tests__/golden/__golden__/Resizable-options-1-1.golden.json index 5e9df2c3..8b4541e6 100644 --- a/__tests__/golden/__golden__/Resizable-options-1-1.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-1-1.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"element","lock":true,"max":[120,115],"min":[80,70],"mode":"frozen","name":"Resizable-options-1-1","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-1-2.golden.json b/__tests__/golden/__golden__/Resizable-options-1-2.golden.json index 6a3ff221..80daf5ff 100644 --- a/__tests__/golden/__golden__/Resizable-options-1-2.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-1-2.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"element","lock":false,"max":[120,115],"min":[80,70],"mode":"clamp","name":"Resizable-options-1-2","opts":{},"pointer":"touch","points":[[10,5],[10,5],[0,0]],"scale":2,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.5,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"105px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.5,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","102.5px"],["width","105px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","105px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","105px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","105px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","105px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","105px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-1-3.golden.json b/__tests__/golden/__golden__/Resizable-options-1-3.golden.json index d1608346..cb0d2a11 100644 --- a/__tests__/golden/__golden__/Resizable-options-1-3.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-1-3.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"element","lock":true,"max":null,"min":null,"mode":"follow","name":"Resizable-options-1-3","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","105px"],["width","105px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-2-0.golden.json b/__tests__/golden/__golden__/Resizable-options-2-0.golden.json index 49cab646..b9b928d8 100644 --- a/__tests__/golden/__golden__/Resizable-options-2-0.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-2-0.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"fn","lock":true,"max":[120,115],"min":[80,70],"mode":"follow","name":"Resizable-options-2-0","opts":{},"pointer":"touch","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":0.5,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":95.39823008849561,"width":109.02654867256638}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":95.39823008849561,"width":109.02654867256638}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":95.39823008849561,"width":109.02654867256638}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","95.39823008849561px"],["width","109.02654867256638px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":95.39823008849561,"width":109.02654867256638}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","95.39823008849561px"],["width","109.02654867256638px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","95.39823008849561px"],["width","109.02654867256638px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","95.39823008849561px"],["width","109.02654867256638px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-2-1.golden.json b/__tests__/golden/__golden__/Resizable-options-2-1.golden.json index 404eb56e..76928593 100644 --- a/__tests__/golden/__golden__/Resizable-options-2-1.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-2-1.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"fn","lock":false,"max":[120,115],"min":[80,70],"mode":"frozen","name":"Resizable-options-2-1","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-2-2.golden.json b/__tests__/golden/__golden__/Resizable-options-2-2.golden.json index 3dcec09b..a7d89e5b 100644 --- a/__tests__/golden/__golden__/Resizable-options-2-2.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-2-2.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"fn","lock":true,"max":null,"min":null,"mode":"clamp","name":"Resizable-options-2-2","opts":{},"pointer":"touch","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":2,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":75,"width":75}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"75px","tag":"div","width":"75px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":85,"width":85}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"85px","tag":"div","width":"85px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":95,"width":95}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"95px","tag":"div","width":"95px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":75,"width":75}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","75px"],["width","75px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":85,"width":85}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","85px"],["width","85px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":95,"width":95}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","95px"],["width","95px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-2-3.golden.json b/__tests__/golden/__golden__/Resizable-options-2-3.golden.json index c7fe7deb..ca7830a3 100644 --- a/__tests__/golden/__golden__/Resizable-options-2-3.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-2-3.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"fn","lock":false,"max":null,"min":[80,70],"mode":"follow","name":"Resizable-options-2-3","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":80,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"80px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":70,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":70,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","90px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":80,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","80px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":70,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":70,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-3-0.golden.json b/__tests__/golden/__golden__/Resizable-options-3-0.golden.json index 3fff4bce..d763e46d 100644 --- a/__tests__/golden/__golden__/Resizable-options-3-0.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-3-0.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"component","lock":false,"max":[120,115],"min":[80,70],"mode":"follow","name":"Resizable-options-3-0","opts":{},"pointer":"touch","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":0.5,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":115,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":95,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":95,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":115,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":95,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","95px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":95,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","95px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","95px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","95px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-3-1.golden.json b/__tests__/golden/__golden__/Resizable-options-3-1.golden.json index af7ce7b5..8f9e69f7 100644 --- a/__tests__/golden/__golden__/Resizable-options-3-1.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-3-1.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"component","lock":true,"max":null,"min":null,"mode":"frozen","name":"Resizable-options-3-1","opts":{},"pointer":"mouse","points":[[10,5],[10,5],[0,0]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":92.5,"width":92.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":92.5,"width":92.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-3-2.golden.json b/__tests__/golden/__golden__/Resizable-options-3-2.golden.json index a68c9482..872c2685 100644 --- a/__tests__/golden/__golden__/Resizable-options-3-2.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-3-2.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"component","lock":false,"max":null,"min":[80,70],"mode":"clamp","name":"Resizable-options-3-2","opts":{},"pointer":"touch","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":2,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":135}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":135}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-options-3-3.golden.json b/__tests__/golden/__golden__/Resizable-options-3-3.golden.json index 2b739e1c..5bf10ebc 100644 --- a/__tests__/golden/__golden__/Resizable-options-3-3.golden.json +++ b/__tests__/golden/__golden__/Resizable-options-3-3.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"component","lock":true,"max":[120,115],"min":[80,70],"mode":"follow","name":"Resizable-options-3-3","opts":{},"pointer":"mouse","points":[[10,5],[10,5],[0,0]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":103.75,"width":103.75}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"103.75px","tag":"div","width":"103.75px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":101.875,"width":101.875}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":101.875,"width":101.875}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":103.75,"width":103.75}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","103.75px"],["width","103.75px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":101.875,"width":101.875}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","101.875px"],["width","101.875px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":101.875,"width":101.875}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","101.875px"],["width","101.875px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","101.875px"],["width","101.875px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","101.875px"],["width","101.875px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-both-bottomright-batched.golden.json index 3db0209e..2352d603 100644 --- a/__tests__/golden/__golden__/Resizable-s-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-both-bottomright-per-event.golden.json index 8496494b..c3b6316d 100644 --- a/__tests__/golden/__golden__/Resizable-s-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-both-topleft-batched.golden.json index 99691dd3..dcece76b 100644 --- a/__tests__/golden/__golden__/Resizable-s-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-both-topleft-per-event.golden.json index b63147a6..e685651c 100644 --- a/__tests__/golden/__golden__/Resizable-s-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-none-bottomright-batched.golden.json index 4808dc1b..215fc2c2 100644 --- a/__tests__/golden/__golden__/Resizable-s-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-none-bottomright-per-event.golden.json index 6e6ea49e..8ce57c25 100644 --- a/__tests__/golden/__golden__/Resizable-s-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-none-topleft-batched.golden.json index 5b84e34e..fc85e0cd 100644 --- a/__tests__/golden/__golden__/Resizable-s-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-none-topleft-per-event.golden.json index 80b50fd7..9697f92f 100644 --- a/__tests__/golden/__golden__/Resizable-s-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-x-bottomright-batched.golden.json index 97d99a80..d765a2ad 100644 --- a/__tests__/golden/__golden__/Resizable-s-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-x-bottomright-per-event.golden.json index 5a8ce57c..0f589b9f 100644 --- a/__tests__/golden/__golden__/Resizable-s-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-x-topleft-batched.golden.json index 29654592..719ee2fa 100644 --- a/__tests__/golden/__golden__/Resizable-s-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-x-topleft-per-event.golden.json index 2e9016c7..58aa21a5 100644 --- a/__tests__/golden/__golden__/Resizable-s-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-y-bottomright-batched.golden.json index 2554d483..7c4c695a 100644 --- a/__tests__/golden/__golden__/Resizable-s-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-y-bottomright-per-event.golden.json index ae9df547..2fdd7c47 100644 --- a/__tests__/golden/__golden__/Resizable-s-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-s-y-topleft-batched.golden.json index bdd6cb28..f5664c8b 100644 --- a/__tests__/golden/__golden__/Resizable-s-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-s-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-s-y-topleft-per-event.golden.json index 79aa9c4c..61b77b2d 100644 --- a/__tests__/golden/__golden__/Resizable-s-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-s-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-s-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-both-bottomright-batched.golden.json index f604254c..29a7b753 100644 --- a/__tests__/golden/__golden__/Resizable-se-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-both-bottomright-per-event.golden.json index 4f9748ee..fb6486cb 100644 --- a/__tests__/golden/__golden__/Resizable-se-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-both-topleft-batched.golden.json index c37763c3..95203c11 100644 --- a/__tests__/golden/__golden__/Resizable-se-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-both-topleft-per-event.golden.json index 34521522..cba12cbb 100644 --- a/__tests__/golden/__golden__/Resizable-se-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-none-bottomright-batched.golden.json index ef21e608..bb514c51 100644 --- a/__tests__/golden/__golden__/Resizable-se-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-none-bottomright-per-event.golden.json index 6d2e77e6..06da9c18 100644 --- a/__tests__/golden/__golden__/Resizable-se-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-none-topleft-batched.golden.json index fd03c28c..a0153596 100644 --- a/__tests__/golden/__golden__/Resizable-se-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-none-topleft-per-event.golden.json index 0c2d917f..54ce5cd9 100644 --- a/__tests__/golden/__golden__/Resizable-se-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-x-bottomright-batched.golden.json index 4ef042cf..274b758a 100644 --- a/__tests__/golden/__golden__/Resizable-se-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-x-bottomright-per-event.golden.json index 2ea42c54..701b8a7c 100644 --- a/__tests__/golden/__golden__/Resizable-se-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-x-topleft-batched.golden.json index 056f691b..3acbdea5 100644 --- a/__tests__/golden/__golden__/Resizable-se-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-x-topleft-per-event.golden.json index bc6afd69..b44805ef 100644 --- a/__tests__/golden/__golden__/Resizable-se-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-y-bottomright-batched.golden.json index 0e6348e9..e69f024c 100644 --- a/__tests__/golden/__golden__/Resizable-se-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-y-bottomright-per-event.golden.json index 703ae23d..773a3974 100644 --- a/__tests__/golden/__golden__/Resizable-se-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-se-y-topleft-batched.golden.json index 9150cbee..f2845c81 100644 --- a/__tests__/golden/__golden__/Resizable-se-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-se-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-se-y-topleft-per-event.golden.json index 7b901262..d4060ece 100644 --- a/__tests__/golden/__golden__/Resizable-se-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-se-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-se-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-both-bottomright-batched.golden.json index 6bf9a6d3..4cc25171 100644 --- a/__tests__/golden/__golden__/Resizable-sw-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-both-bottomright-per-event.golden.json index 34086147..3b2ab979 100644 --- a/__tests__/golden/__golden__/Resizable-sw-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-both-topleft-batched.golden.json index fd2f6a43..bce69ab3 100644 --- a/__tests__/golden/__golden__/Resizable-sw-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-both-topleft-per-event.golden.json index 696c566c..08965cf8 100644 --- a/__tests__/golden/__golden__/Resizable-sw-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-none-bottomright-batched.golden.json index 1bbb7d8c..dc12dbf9 100644 --- a/__tests__/golden/__golden__/Resizable-sw-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-none-bottomright-per-event.golden.json index 10174fe8..ef79526f 100644 --- a/__tests__/golden/__golden__/Resizable-sw-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-none-topleft-batched.golden.json index d404635f..9808242c 100644 --- a/__tests__/golden/__golden__/Resizable-sw-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-none-topleft-per-event.golden.json index 638462fa..ba410246 100644 --- a/__tests__/golden/__golden__/Resizable-sw-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-x-bottomright-batched.golden.json index a968d337..b686a86c 100644 --- a/__tests__/golden/__golden__/Resizable-sw-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-x-bottomright-per-event.golden.json index 40f8bf8d..c29dea12 100644 --- a/__tests__/golden/__golden__/Resizable-sw-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-x-topleft-batched.golden.json index 9ab54c91..1c93d2a9 100644 --- a/__tests__/golden/__golden__/Resizable-sw-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-x-topleft-per-event.golden.json index ed0e00ab..79d6c245 100644 --- a/__tests__/golden/__golden__/Resizable-sw-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-y-bottomright-batched.golden.json index a4180c3a..9908720f 100644 --- a/__tests__/golden/__golden__/Resizable-sw-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-y-bottomright-per-event.golden.json index 8b712820..192c6fac 100644 --- a/__tests__/golden/__golden__/Resizable-sw-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-sw-y-topleft-batched.golden.json index 750aeeb4..3e1b9836 100644 --- a/__tests__/golden/__golden__/Resizable-sw-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-sw-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-sw-y-topleft-per-event.golden.json index a595fc0a..80a1cada 100644 --- a/__tests__/golden/__golden__/Resizable-sw-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-sw-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-sw-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-both-bottomright-batched.golden.json index 7f23f9cb..b842fb26 100644 --- a/__tests__/golden/__golden__/Resizable-w-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-both-bottomright-per-event.golden.json index 6dda75bc..eac7ba99 100644 --- a/__tests__/golden/__golden__/Resizable-w-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-both-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-both-topleft-batched.golden.json index 556d4e85..efd617ed 100644 --- a/__tests__/golden/__golden__/Resizable-w-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-both-topleft-per-event.golden.json index 262a0fc3..c7de13ac 100644 --- a/__tests__/golden/__golden__/Resizable-w-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-none-bottomright-batched.golden.json index 2d932922..697bbd3b 100644 --- a/__tests__/golden/__golden__/Resizable-w-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-none-bottomright-per-event.golden.json index be991349..bdd0bd0f 100644 --- a/__tests__/golden/__golden__/Resizable-w-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-none-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-none-topleft-batched.golden.json index 54cf779a..e40fe420 100644 --- a/__tests__/golden/__golden__/Resizable-w-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-none-topleft-per-event.golden.json index cd38af7f..bd087636 100644 --- a/__tests__/golden/__golden__/Resizable-w-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-x-bottomright-batched.golden.json index 3f22c5d0..c9a37967 100644 --- a/__tests__/golden/__golden__/Resizable-w-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-x-bottomright-per-event.golden.json index df6dc6b3..a476a9ca 100644 --- a/__tests__/golden/__golden__/Resizable-w-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-x-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-x-topleft-batched.golden.json index e62b97c1..4804d3fb 100644 --- a/__tests__/golden/__golden__/Resizable-w-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-x-topleft-per-event.golden.json index 3aa6b34e..6a8eec48 100644 --- a/__tests__/golden/__golden__/Resizable-w-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-y-bottomright-batched.golden.json index 1efabb4b..ba20326c 100644 --- a/__tests__/golden/__golden__/Resizable-w-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-y-bottomright-per-event.golden.json index cf176147..66870995 100644 --- a/__tests__/golden/__golden__/Resizable-w-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-y-topleft-batched.golden.json b/__tests__/golden/__golden__/Resizable-w-y-topleft-batched.golden.json index fa9e78d5..42cb2aab 100644 --- a/__tests__/golden/__golden__/Resizable-w-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/Resizable-w-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/Resizable-w-y-topleft-per-event.golden.json index 8170ca36..083a8b61 100644 --- a/__tests__/golden/__golden__/Resizable-w-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/Resizable-w-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"Resizable-w-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-batched.golden.json index 89a3e793..a355c54f 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-per-event.golden.json index 2db785ce..2e54f7de 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-both-bottomright-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"170px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"180px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"260px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"270px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"290px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"310px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"350px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"360px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","170px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","180px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","200px"],["width","200px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","210px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","260px"],["width","230px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","270px"],["width","240px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","290px"],["width","260px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","310px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","350px"],["width","320px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","360px"],["width","340px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-batched.golden.json index e7302127..39e1173c 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-per-event.golden.json index bb7f77a7..063b9d68 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-both-topleft-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"150px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"140px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"150px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"170px","tag":"div","width":"170px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"180px","tag":"div","width":"180px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"210px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"230px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"240px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"260px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"270px","tag":"div","width":"270px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","150px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","140px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","150px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","170px"],["width","170px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","180px"],["width","180px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","200px"],["width","200px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","210px"],["width","210px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","230px"],["width","230px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","240px"],["width","240px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","260px"],["width","260px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","270px"],["width","270px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-batched.golden.json index edd56f89..a8d80441 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-per-event.golden.json index c0007d1b..961c4b9d 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-none-bottomright-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-batched.golden.json index 70745e3c..d49cba5c 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-per-event.golden.json index c16d466f..9fb59a7c 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-none-topleft-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-batched.golden.json index 61a12160..8864c61d 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-per-event.golden.json index 9bf2b2a4..be4c0ef6 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-x-bottomright-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","200px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","210px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","230px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","240px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","260px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","320px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","340px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-batched.golden.json index 25ecd012..9931f115 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-per-event.golden.json index 0c44f381..4aa330b2 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-x-topleft-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"150px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"170px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"180px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"270px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","150px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":10,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":170}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","170px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","180px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","200px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","210px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","230px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","240px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","260px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":270}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","270px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-batched.golden.json index 26871b49..10bfe918 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-per-event.golden.json index 76ac9154..af530e70 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-y-bottomright-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"170px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"180px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"200px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"260px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"270px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"290px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"310px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"350px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"360px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","170px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","180px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","200px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","260px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","270px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","290px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","310px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","340px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","340px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","340px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","350px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","360px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-batched.golden.json index 0b875e13..54bd12f6 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-batched.golden.json @@ -1,55 +1,55 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-per-event.golden.json index cfff049e..5692c33b 100644 --- a/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-all-handles-y-topleft-per-event.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-all-handles-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"140px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"150px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"170px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"180px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"200px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"210px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"230px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"240px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"260px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"270px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":140,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","140px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":150,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","150px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":170,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","170px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":180,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","180px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":190,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":200,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","200px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":210,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","210px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":230,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","230px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":240,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","240px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":250,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":260,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","260px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":270,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","270px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":280,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":30,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":30,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-false.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-false.golden.json index 0e058eb7..a6b26df7 100644 --- a/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-false.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-false.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[120,115],"min":null,"mode":"follow","name":"ResizableBox-constraints-max-binding-return-lock-false","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","115px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","115px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-true.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-true.golden.json index a8a1e616..a5b78d80 100644 --- a/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-true.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-constraints-max-binding-return-lock-true.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":[120,115],"min":null,"mode":"follow","name":"ResizableBox-constraints-max-binding-return-lock-true","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"115px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":111.09502262443442,"width":108.53393665158374}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"111.09502262443442px","tag":"div","width":"108.53393665158374px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90.86455419266944,"width":88.76984346958983}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90.86455419266944,"width":88.76984346958983}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","115px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","115px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":111.09502262443442,"width":108.53393665158374}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","111.09502262443442px"],["width","108.53393665158374px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90.86455419266944,"width":88.76984346958983}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90.86455419266944px"],["width","88.76984346958983px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90.86455419266944,"width":88.76984346958983}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90.86455419266944px"],["width","88.76984346958983px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90.86455419266944px"],["width","88.76984346958983px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90.86455419266944px","tag":"div","width":"88.76984346958983px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90.86455419266944px"],["width","88.76984346958983px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-false.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-false.golden.json index 4482865c..133def3b 100644 --- a/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-false.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-false.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[1000,1000],"min":null,"mode":"follow","name":"ResizableBox-constraints-max-not-binding-lock-false","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-true.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-true.golden.json index 95070b68..2b6080a1 100644 --- a/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-true.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-constraints-max-not-binding-lock-true.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":[1000,1000],"min":null,"mode":"follow","name":"ResizableBox-constraints-max-not-binding-lock-true","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-false.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-false.golden.json index cc03eb6b..128265e4 100644 --- a/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-false.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-false.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":null,"min":[80,70],"mode":"follow","name":"ResizableBox-constraints-min-binding-return-lock-false","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":80,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"80px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":80,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","80px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-true.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-true.golden.json index b9aad894..8c352562 100644 --- a/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-true.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-constraints-min-binding-return-lock-true.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":null,"min":[80,70],"mode":"follow","name":"ResizableBox-constraints-min-binding-return-lock-true","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":74.33628318584073,"width":84.9557522123894}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"74.33628318584073px","tag":"div","width":"84.9557522123894px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.21238938053101,"width":116.81415929203543}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.21238938053101,"width":116.81415929203543}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":74.33628318584073,"width":84.9557522123894}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","74.33628318584073px"],["width","84.9557522123894px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.21238938053101,"width":116.81415929203543}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","102.21238938053101px"],["width","116.81415929203543px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.21238938053101,"width":116.81415929203543}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","102.21238938053101px"],["width","116.81415929203543px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","102.21238938053101px"],["width","116.81415929203543px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"102.21238938053101px","tag":"div","width":"116.81415929203543px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","102.21238938053101px"],["width","116.81415929203543px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-false.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-false.golden.json index 0fbe215a..4adc520b 100644 --- a/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-false.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-false.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":null,"min":[20,20],"mode":"follow","name":"ResizableBox-constraints-min-not-binding-lock-false","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-true.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-true.golden.json index 191224d8..71371c7d 100644 --- a/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-true.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-constraints-min-not-binding-lock-true.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":null,"min":[20,20],"mode":"follow","name":"ResizableBox-constraints-min-not-binding-lock-true","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-false.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-false.golden.json index 2ca9a0a0..f2ec6db7 100644 --- a/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-false.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-false.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[110,110],"min":[90,90],"mode":"follow","name":"ResizableBox-constraints-tight-min-max-lock-false","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-true.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-true.golden.json index 1ad063a3..ec744930 100644 --- a/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-true.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-constraints-tight-min-max-lock-true.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":[110,110],"min":[90,90],"mode":"follow","name":"ResizableBox-constraints-tight-min-max-lock-true","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"90px","tag":"div","width":"90px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":90,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-false.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-false.golden.json index c4830034..8e5f9ba8 100644 --- a/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-false.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-false.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":null,"min":null,"mode":"follow","name":"ResizableBox-constraints-unbounded-lock-false","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-true.golden.json b/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-true.golden.json index d5639f3d..143bec71 100644 --- a/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-true.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-constraints-unbounded-lock-true.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":true,"max":null,"min":null,"mode":"follow","name":"ResizableBox-constraints-unbounded-lock-true","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-batched.golden.json index f85bf5f3..9a922ad5 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-per-event.golden.json index 67f4c529..7e12a747 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-both-topleft-batched.golden.json index 54311006..bb252deb 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-both-topleft-per-event.golden.json index ebd7276d..77f14258 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-batched.golden.json index d97a0715..564be96d 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-per-event.golden.json index 74ce4a7a..48111971 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-none-topleft-batched.golden.json index 0b5b621c..992db863 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-none-topleft-per-event.golden.json index 3fa522e5..f1ec1119 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-batched.golden.json index 6781859d..3ee9d92e 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-per-event.golden.json index 2f9377f8..833fd9d2 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-x-topleft-batched.golden.json index 0423b987..d4721483 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-x-topleft-per-event.golden.json index c32b6f52..bf9f9735 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-batched.golden.json index 8dd25fee..777905ef 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-per-event.golden.json index 65c5ad2b..bf45a1f3 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-e-y-topleft-batched.golden.json index 79ea3833..c5b6796e 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-e-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-e-y-topleft-per-event.golden.json index 7f00c9f3..4a43fcdb 100644 --- a/__tests__/golden/__golden__/ResizableBox-e-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-e-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-e-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-batched.golden.json index 5f52c585..0772c5b2 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-per-event.golden.json index 0da53d2a..41171708 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-both-topleft-batched.golden.json index aabf68f4..4dc1a929 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-both-topleft-per-event.golden.json index 082ca189..343b6228 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-batched.golden.json index 3611e0fb..19bcffdf 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-per-event.golden.json index bf8d051b..93668027 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-none-topleft-batched.golden.json index 30ff71dd..c70d0159 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-none-topleft-per-event.golden.json index d1655bec..5e4e61af 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-batched.golden.json index e612b1e3..a56264de 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-per-event.golden.json index ecbeca24..70d1bc27 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-x-topleft-batched.golden.json index 43d5d27b..9b6947e4 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-x-topleft-per-event.golden.json index f663de9f..c8110c4f 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-batched.golden.json index 387dece6..7587a249 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-per-event.golden.json index 7d28ceed..58545720 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-n-y-topleft-batched.golden.json index 28b7f3f5..be6a209a 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-n-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-n-y-topleft-per-event.golden.json index 7373cbc1..759053c5 100644 --- a/__tests__/golden/__golden__/ResizableBox-n-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-n-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-n-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-batched.golden.json index 7ecf9a65..79cb3a57 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-per-event.golden.json index 0b9eea50..c7afa83c 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-batched.golden.json index 2bc9f2d7..e8d31882 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-per-event.golden.json index e7598c9a..b8e7c173 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-batched.golden.json index 1cefbb66..fb507045 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-per-event.golden.json index 58c2de52..29955946 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-batched.golden.json index 6470865a..77115688 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-per-event.golden.json index e2e0639a..5c0e906c 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-batched.golden.json index c9daf435..5d39eecc 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-per-event.golden.json index 1cb14b6a..49a979da 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-batched.golden.json index a21ac7f2..d852091c 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-per-event.golden.json index d5adc006..031d33f8 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-batched.golden.json index 837605bc..a25cf3bc 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-per-event.golden.json index 9f67c973..646b4e8b 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-batched.golden.json index 1ebaabe9..dc8ce7c0 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-per-event.golden.json index 84386f6d..528c4389 100644 --- a/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-ne-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-ne-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-batched.golden.json index 12ef657b..efb5258f 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-per-event.golden.json index 19bd0487..85bf4217 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-batched.golden.json index 4ca30593..479c6560 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-per-event.golden.json index 59e8d6ca..7ce5dcab 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-batched.golden.json index 62242785..90991d82 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-per-event.golden.json index b7a65e95..94ea6f1f 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-batched.golden.json index aea3ac2a..f582a5b9 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-per-event.golden.json index 66700131..83cf97f5 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-batched.golden.json index 9c1c2510..c5f126fe 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-per-event.golden.json index f54ee345..b73c4d50 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-batched.golden.json index 366c4850..87f479e5 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-per-event.golden.json index 9bd08d1c..7d73951a 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-batched.golden.json index 55479e9f..d8a2df77 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-per-event.golden.json index 743b7a9d..a9929223 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-batched.golden.json index a44f8db5..9ce6c03a 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-per-event.golden.json index 08035048..0504e54b 100644 --- a/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-nw-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-nw-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-0-0.golden.json b/__tests__/golden/__golden__/ResizableBox-options-0-0.golden.json index e3b69e4c..fcfbadc8 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-0-0.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-0-0.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":true,"max":null,"min":null,"mode":"follow","name":"ResizableBox-options-0-0","opts":{},"pointer":"touch","points":[[10,10],[20,20],[30,30]],"scale":0.5,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-0-1.golden.json b/__tests__/golden/__golden__/ResizableBox-options-0-1.golden.json index 3f427d84..bc3e59fc 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-0-1.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-0-1.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":null,"min":[80,70],"mode":"frozen","name":"ResizableBox-options-0-1","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"200px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"90px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"90px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"90px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","200px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"90px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-0-2.golden.json b/__tests__/golden/__golden__/ResizableBox-options-0-2.golden.json index bc576845..5c58ae67 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-0-2.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-0-2.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":true,"max":[120,115],"min":[80,70],"mode":"clamp","name":"ResizableBox-options-0-2","opts":{},"pointer":"touch","points":[[10,10],[20,20],[30,30]],"scale":2,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","105px"],["width","105px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","107.5px"],["width","107.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","107.5px"],["width","107.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","107.5px"],["width","107.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","107.5px"],["width","107.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-0-3.golden.json b/__tests__/golden/__golden__/ResizableBox-options-0-3.golden.json index 7cf4eac9..bca7f05c 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-0-3.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-0-3.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[120,115],"min":[80,70],"mode":"follow","name":"ResizableBox-options-0-3","opts":{},"pointer":"mouse","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":115,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"115px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"115px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"115px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":115,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","115px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","115px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","115px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-1-0.golden.json b/__tests__/golden/__golden__/ResizableBox-options-1-0.golden.json index 29614cb5..251d2b40 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-1-0.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-1-0.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"element","lock":false,"max":null,"min":[80,70],"mode":"follow","name":"ResizableBox-options-1-0","opts":{},"pointer":"touch","points":[[10,5],[10,5],[0,0]],"scale":0.5,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"element-handle","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-1-1.golden.json b/__tests__/golden/__golden__/ResizableBox-options-1-1.golden.json index 1d3b98e9..c4002dde 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-1-1.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-1-1.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"element","lock":true,"max":[120,115],"min":[80,70],"mode":"frozen","name":"ResizableBox-options-1-1","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":86.37168141592925,"width":94.42477876106199}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"86.37168141592925px","tag":"div","width":"94.42477876106199px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":105.44299675045976,"width":115.2742597671522}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"105.44299675045976px","tag":"div","width":"115.2742597671522px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":105.44299675045976,"width":115.2742597671522}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"105.44299675045976px","tag":"div","width":"115.2742597671522px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"105.44299675045976px","tag":"div","width":"115.2742597671522px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":86.37168141592925,"width":94.42477876106199}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","86.37168141592925px"],["width","94.42477876106199px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":105.44299675045976,"width":115.2742597671522}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","105.44299675045976px"],["width","115.2742597671522px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":105.44299675045976,"width":115.2742597671522}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","105.44299675045976px"],["width","115.2742597671522px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","105.44299675045976px"],["width","115.2742597671522px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"105.44299675045976px","tag":"div","width":"115.2742597671522px"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","105.44299675045976px"],["width","115.2742597671522px"]],"tag":"div"},"handles":[{"axis":"nw","className":"element-handle","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-1-2.golden.json b/__tests__/golden/__golden__/ResizableBox-options-1-2.golden.json index a0464ea3..ac83b36a 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-1-2.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-1-2.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"element","lock":false,"max":[120,115],"min":[80,70],"mode":"clamp","name":"ResizableBox-options-1-2","opts":{},"pointer":"touch","points":[[10,5],[10,5],[0,0]],"scale":2,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.5,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"105px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.5,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","102.5px"],["width","105px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","105px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","105px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","105px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","105px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"105px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","105px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-1-3.golden.json b/__tests__/golden/__golden__/ResizableBox-options-1-3.golden.json index a87e9bd6..ec2736bf 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-1-3.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-1-3.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"element","lock":true,"max":null,"min":null,"mode":"follow","name":"ResizableBox-options-1-3","opts":{},"pointer":"mouse","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","105px"],["width","105px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"ne","className":"element-handle","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-2-0.golden.json b/__tests__/golden/__golden__/ResizableBox-options-2-0.golden.json index c399b3a0..e23b3517 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-2-0.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-2-0.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"fn","lock":true,"max":[120,115],"min":[80,70],"mode":"follow","name":"ResizableBox-options-2-0","opts":{},"pointer":"touch","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":0.5,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"70px","tag":"div","width":"80px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":95.39823008849561,"width":109.02654867256638}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":95.39823008849561,"width":109.02654867256638}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":70,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":95.39823008849561,"width":109.02654867256638}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","95.39823008849561px"],["width","109.02654867256638px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":95.39823008849561,"width":109.02654867256638}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","95.39823008849561px"],["width","109.02654867256638px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","95.39823008849561px"],["width","109.02654867256638px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"95.39823008849561px","tag":"div","width":"109.02654867256638px"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","95.39823008849561px"],["width","109.02654867256638px"]],"tag":"div"},"handles":[{"axis":"s","className":"function-handle function-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-2-1.golden.json b/__tests__/golden/__golden__/ResizableBox-options-2-1.golden.json index 1f286e1e..6f89c4df 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-2-1.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-2-1.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"fn","lock":false,"max":[120,115],"min":[80,70],"mode":"frozen","name":"ResizableBox-options-2-1","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"90px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"80px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"80px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"80px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"80px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":90}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","90px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"80px"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"w","className":"function-handle function-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-2-2.golden.json b/__tests__/golden/__golden__/ResizableBox-options-2-2.golden.json index 656a6351..c88696e3 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-2-2.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-2-2.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"fn","lock":true,"max":null,"min":null,"mode":"clamp","name":"ResizableBox-options-2-2","opts":{},"pointer":"touch","points":[[-100,-100],[-60,-60],[-20,-20],[10,10]],"scale":2,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":75,"width":75}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"75px","tag":"div","width":"75px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":85,"width":85}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"85px","tag":"div","width":"85px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":95,"width":95}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"95px","tag":"div","width":"95px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":75,"width":75}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","75px"],["width","75px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-100,"clientY":-100,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":85,"width":85}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","85px"],["width","85px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-60,"clientY":-60,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":95,"width":95}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","95px"],["width","95px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"e","className":"function-handle function-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-2-3.golden.json b/__tests__/golden/__golden__/ResizableBox-options-2-3.golden.json index 3a0082ab..67dc86aa 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-2-3.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-2-3.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"fn","lock":false,"max":null,"min":[80,70],"mode":"follow","name":"ResizableBox-options-2-3","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"90px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":80,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"80px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":70,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":70,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":90,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","90px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":80,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","80px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":70,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":70,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"70px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","70px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"function-handle function-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-3-0.golden.json b/__tests__/golden/__golden__/ResizableBox-options-3-0.golden.json index 85cb4efd..2d1eceb2 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-3-0.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-3-0.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"component","lock":false,"max":[120,115],"min":[80,70],"mode":"follow","name":"ResizableBox-options-3-0","opts":{},"pointer":"touch","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":0.5,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":115,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"115px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"115px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"115px","tag":"div","width":"80px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":95,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":95,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":115,"width":80}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","115px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","115px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","115px"],["width","80px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":95,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","95px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":95,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","95px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","95px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"95px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","95px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"component-handle component-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-3-1.golden.json b/__tests__/golden/__golden__/ResizableBox-options-3-1.golden.json index a340ae9a..0c3d5eb1 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-3-1.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-3-1.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"component","lock":true,"max":null,"min":null,"mode":"frozen","name":"ResizableBox-options-3-1","opts":{},"pointer":"mouse","points":[[10,5],[10,5],[0,0]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":92.5,"width":92.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"92.5px","tag":"div","width":"92.5px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"92.5px","tag":"div","width":"92.5px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":92.5,"width":92.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","92.5px"],["width","92.5px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","92.5px"],["width","92.5px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"component-handle component-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-3-2.golden.json b/__tests__/golden/__golden__/ResizableBox-options-3-2.golden.json index 1290dd08..cb84222e 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-3-2.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-3-2.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"component","lock":false,"max":null,"min":[80,70],"mode":"clamp","name":"ResizableBox-options-3-2","opts":{},"pointer":"touch","points":[[80,60],[40,30],[10,10],[-10,-10]],"scale":2,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"140px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":145,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"145px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":150,"width":165}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"150px","tag":"div","width":"165px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":145,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"145px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":145,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"145px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"145px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":60,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":145,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","145px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":30,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":150,"width":165}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","150px"],["width","165px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":145,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","145px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":145,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","145px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchend"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","145px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"145px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","145px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"component-handle component-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-options-3-3.golden.json b/__tests__/golden/__golden__/ResizableBox-options-3-3.golden.json index 484987c3..1c067339 100644 --- a/__tests__/golden/__golden__/ResizableBox-options-3-3.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-options-3-3.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"component","lock":true,"max":[120,115],"min":[80,70],"mode":"follow","name":"ResizableBox-options-3-3","opts":{},"pointer":"mouse","points":[[10,5],[10,5],[0,0]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":103.75,"width":103.75}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"103.75px","tag":"div","width":"103.75px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":101.875,"width":101.875}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":101.875,"width":101.875}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":103.75,"width":103.75}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","103.75px"],["width","103.75px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":101.875,"width":101.875}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","101.875px"],["width","101.875px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":101.875,"width":101.875}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","101.875px"],["width","101.875px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","101.875px"],["width","101.875px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"101.875px","tag":"div","width":"101.875px"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","101.875px"],["width","101.875px"]],"tag":"div"},"handles":[{"axis":"ne","className":"component-handle component-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-batched.golden.json index 5cf6a5ac..49a4d021 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-per-event.golden.json index a5c1c66c..e83973f7 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-both-topleft-batched.golden.json index 6a7c0795..a3cb58a2 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-both-topleft-per-event.golden.json index de3a8628..2fa25016 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-batched.golden.json index ddd9b6c9..ea049ef2 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-per-event.golden.json index d96af63d..0f9051a7 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-none-topleft-batched.golden.json index 0d9b60b4..840a14be 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-none-topleft-per-event.golden.json index 67b33f37..3e240f08 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-batched.golden.json index 4ce46af9..789ad976 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-per-event.golden.json index 09840405..a9849546 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-x-topleft-batched.golden.json index 22638476..86ab95c4 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-x-topleft-per-event.golden.json index bc3c714a..26079216 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-batched.golden.json index 1e37905a..e9db814f 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-per-event.golden.json index 2bb0cf23..19253a7c 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-s-y-topleft-batched.golden.json index f0082823..5526269b 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-s-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-s-y-topleft-per-event.golden.json index 70848bce..69c2084f 100644 --- a/__tests__/golden/__golden__/ResizableBox-s-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-s-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-s-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-batched.golden.json index ff3925df..4c5fef27 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-per-event.golden.json index 935349cf..697dab25 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-both-topleft-batched.golden.json index 7f14fea2..00e23784 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-both-topleft-per-event.golden.json index 6f0ee304..09a4ea3d 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-batched.golden.json index 2cb683f3..89db67cc 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-per-event.golden.json index 1c608fe1..69373771 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-none-topleft-batched.golden.json index bac82e13..83b763b3 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-none-topleft-per-event.golden.json index c2412f6e..d4e24b5b 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-batched.golden.json index 1739ce7b..2128f76c 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-per-event.golden.json index a143c02f..29f35462 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-x-topleft-batched.golden.json index 263abd75..f44ea487 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-x-topleft-per-event.golden.json index 562a61f9..d579aba3 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-batched.golden.json index 49c25fe8..930b3adf 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-per-event.golden.json index 2321fa5b..4c27d927 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-se-y-topleft-batched.golden.json index 533e49bc..f11b805b 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-se-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-se-y-topleft-per-event.golden.json index 3a5b9928..9ea31814 100644 --- a/__tests__/golden/__golden__/ResizableBox-se-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-se-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-se-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-batched.golden.json index ab424dfe..85e2f923 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-per-event.golden.json index 485a1de6..ab1e739f 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-batched.golden.json index 5c043020..50954a20 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-per-event.golden.json index 4ce8cd72..3d79688a 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-batched.golden.json index f3426342..d3f52bb9 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-per-event.golden.json index 95533182..1b24efa4 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-batched.golden.json index 361ac450..466aadca 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-per-event.golden.json index 6ec20e82..8c4a56c4 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-batched.golden.json index bf074602..c95fc98c 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-per-event.golden.json index a4fa26a7..ebfc2455 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-batched.golden.json index 5b2e8d50..0daa863d 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-per-event.golden.json index 53ded335..6bc3ca29 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-batched.golden.json index bf0ca575..74209462 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-per-event.golden.json index 07f9bd0e..b80a67b0 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-batched.golden.json index c773ef1a..25294d6f 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}},{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-per-event.golden.json index a50f916d..c7928632 100644 --- a/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-sw-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-sw-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-batched.golden.json index dc4a7606..4858ddec 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-both-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-per-event.golden.json index 2d64334f..d67e38a6 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-both-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-both-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-both-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-both-topleft-batched.golden.json index 3608005f..44a1a04b 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-both-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-both-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-both-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-both-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-both-topleft-per-event.golden.json index aeecf19a..cc7d05f9 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-both-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-both-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-both-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-batched.golden.json index f6cea6f6..a7fbb674 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-none-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-per-event.golden.json index 8428a63a..21fc8848 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-none-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-none-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-none-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-none-topleft-batched.golden.json index 93af366d..fcb6ba55 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-none-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-none-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-none-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-none-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-none-topleft-per-event.golden.json index e08a2902..2b690ffd 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-none-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-none-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-none-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-batched.golden.json index 0d876a72..d92be795 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-x-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-per-event.golden.json index e3fd4a1c..3c55810f 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-x-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-x-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-x-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-x-topleft-batched.golden.json index 95066736..77558c73 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-x-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-x-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-x-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-x-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-x-topleft-per-event.golden.json index 776fb792..4dca5aa6 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-x-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-x-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-x-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-batched.golden.json index 2f0d1492..7ee7d327 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-y-bottomright-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-per-event.golden.json index 3a44e9ac..8410a3d2 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-y-bottomright-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-y-bottomright-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-y-topleft-batched.golden.json b/__tests__/golden/__golden__/ResizableBox-w-y-topleft-batched.golden.json index b972a887..a337504c 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-y-topleft-batched.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-y-topleft-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-y-topleft-batched","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/ResizableBox-w-y-topleft-per-event.golden.json b/__tests__/golden/__golden__/ResizableBox-w-y-topleft-per-event.golden.json index f83f37f9..3153c331 100644 --- a/__tests__/golden/__golden__/ResizableBox-w-y-topleft-per-event.golden.json +++ b/__tests__/golden/__golden__/ResizableBox-w-y-topleft-per-event.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"ResizableBox-w-y-topleft-per-event","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/box-cadence-B-stale-props-255.golden.json b/__tests__/golden/__golden__/box-cadence-B-stale-props-255.golden.json index 292f24d1..ae1eb879 100644 --- a/__tests__/golden/__golden__/box-cadence-B-stale-props-255.golden.json +++ b/__tests__/golden/__golden__/box-cadence-B-stale-props-255.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"box-cadence-B-stale-props-255","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-e-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-e-bottomright.golden.json index 208fe376..25d26bb0 100644 --- a/__tests__/golden/__golden__/browser-Resizable-e-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-e-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-e-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-e-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-e-topleft.golden.json index 4a926266..4afa3b70 100644 --- a/__tests__/golden/__golden__/browser-Resizable-e-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-e-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-e-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:e"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-n-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-n-bottomright.golden.json index f88bc96e..46509f4d 100644 --- a/__tests__/golden/__golden__/browser-Resizable-n-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-n-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-n-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-n-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-n-topleft.golden.json index 04c5f81a..ee26bb11 100644 --- a/__tests__/golden/__golden__/browser-Resizable-n-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-n-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-n-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-ne-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-ne-bottomright.golden.json index 8af6f364..4359161a 100644 --- a/__tests__/golden/__golden__/browser-Resizable-ne-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-ne-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-ne-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-ne-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-ne-topleft.golden.json index 47ef8f90..e3f2c546 100644 --- a/__tests__/golden/__golden__/browser-Resizable-ne-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-ne-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-ne-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-nw-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-nw-bottomright.golden.json index 2c7578bf..30e76380 100644 --- a/__tests__/golden/__golden__/browser-Resizable-nw-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-nw-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-nw-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-nw-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-nw-topleft.golden.json index 1293380a..96ae1b8b 100644 --- a/__tests__/golden/__golden__/browser-Resizable-nw-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-nw-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-nw-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-s-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-s-bottomright.golden.json index 4cb465de..af118da2 100644 --- a/__tests__/golden/__golden__/browser-Resizable-s-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-s-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-s-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-s-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-s-topleft.golden.json index adaa04d6..a50dd3ec 100644 --- a/__tests__/golden/__golden__/browser-Resizable-s-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-s-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-s-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-se-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-se-bottomright.golden.json index 8417cde3..aa8e2408 100644 --- a/__tests__/golden/__golden__/browser-Resizable-se-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-se-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-se-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-se-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-se-topleft.golden.json index 4926f166..18eae295 100644 --- a/__tests__/golden/__golden__/browser-Resizable-se-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-se-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-se-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-sw-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-sw-bottomright.golden.json index 1b2fcdca..0485edf0 100644 --- a/__tests__/golden/__golden__/browser-Resizable-sw-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-sw-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-sw-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-sw-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-sw-topleft.golden.json index a395f44a..fbf95284 100644 --- a/__tests__/golden/__golden__/browser-Resizable-sw-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-sw-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-sw-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:sw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-w-bottomright.golden.json b/__tests__/golden/__golden__/browser-Resizable-w-bottomright.golden.json index 0035de71..809dc465 100644 --- a/__tests__/golden/__golden__/browser-Resizable-w-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-w-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-w-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-Resizable-w-topleft.golden.json b/__tests__/golden/__golden__/browser-Resizable-w-topleft.golden.json index a27daea3..2a270fd2 100644 --- a/__tests__/golden/__golden__/browser-Resizable-w-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-Resizable-w-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-Resizable-w-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:w"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-e-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-e-bottomright.golden.json index 4dcd0d12..7215bf6a 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-e-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-e-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-e-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"160px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-e-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-e-topleft.golden.json index afa0c4c2..b65694f3 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-e-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-e-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["e"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-e-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:e"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-n-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-n-bottomright.golden.json index 334fd44c..98dabd0e 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-n-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-n-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-n-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-n-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-n-topleft.golden.json index 2ca93ac0..db872830 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-n-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-n-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-n-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:n"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-ne-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-ne-bottomright.golden.json index da4a7693..169e3eaa 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-ne-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-ne-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-ne-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"160px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-ne-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-ne-topleft.golden.json index fad9ea47..e62660fd 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-ne-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-ne-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-ne-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-nw-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-nw-bottomright.golden.json index 0b988821..5feb9ffb 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-nw-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-nw-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-nw-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-nw-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-nw-topleft.golden.json index 4dd79f1a..66c653b8 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-nw-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-nw-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-nw-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:nw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-s-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-s-bottomright.golden.json index 72bdf25f..d2fda5d2 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-s-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-s-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-s-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-s-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-s-topleft.golden.json index 946d4b49..a9d30479 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-s-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-s-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-s-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"120px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":120,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-se-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-se-bottomright.golden.json index 46a1e585..bbade97b 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-se-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-se-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-se-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-se-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-se-topleft.golden.json index 638ab179..3b8a39ff 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-se-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-se-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-se-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-sw-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-sw-bottomright.golden.json index e568e7e4..831f3b2c 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-sw-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-sw-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-sw-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-sw-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-sw-topleft.golden.json index a0499ffa..d52ae5ae 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-sw-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-sw-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["sw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-sw-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:sw"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-w-bottomright.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-w-bottomright.golden.json index acaf677a..c68c3ed9 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-w-bottomright.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-w-bottomright.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-w-bottomright","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-ResizableBox-w-topleft.golden.json b/__tests__/golden/__golden__/browser-ResizableBox-w-topleft.golden.json index 7dedb0c6..c766d6fb 100644 --- a/__tests__/golden/__golden__/browser-ResizableBox-w-topleft.golden.json +++ b/__tests__/golden/__golden__/browser-ResizableBox-w-topleft.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["w"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-ResizableBox-w-topleft","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"110px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"120px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":100,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","height":"100px","tag":"div","width":"130px"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:w"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-controlled-frozen.golden.json b/__tests__/golden/__golden__/browser-controlled-frozen.golden.json index c4215bbc..3d957dbf 100644 --- a/__tests__/golden/__golden__/browser-controlled-frozen.golden.json +++ b/__tests__/golden/__golden__/browser-controlled-frozen.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"frozen","name":"browser-controlled-frozen","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-grid-relative-deltas.golden.json b/__tests__/golden/__golden__/browser-grid-relative-deltas.golden.json index 4d0c31e4..37148894 100644 --- a/__tests__/golden/__golden__/browser-grid-relative-deltas.golden.json +++ b/__tests__/golden/__golden__/browser-grid-relative-deltas.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-grid-relative-deltas","opts":{"grid":[10,10]},"pointer":"mouse","points":[[2,2],[6,6],[14,14],[26,26]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":2,"clientY":2,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":6,"clientY":6,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":14,"clientY":14,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":26,"clientY":26,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":26,"clientY":26,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":4,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":4,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":2,"clientY":2,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":6,"clientY":6,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":14,"clientY":14,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":26,"clientY":26,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":26,"clientY":26,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":4,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":4,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-known-lock-axis-x.golden.json b/__tests__/golden/__golden__/browser-known-lock-axis-x.golden.json index 8e28edc5..71123245 100644 --- a/__tests__/golden/__golden__/browser-known-lock-axis-x.golden.json +++ b/__tests__/golden/__golden__/browser-known-lock-axis-x.golden.json @@ -1,10 +1,10 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":50,"kind":"default","knownBug":"5.2: aspect projection changes height with axis x","lock":true,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-known-lock-axis-x","opts":{},"pointer":"mouse","points":[[20,0]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":58,"width":116}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":58,"width":116}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":58,"width":116}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","58px"],["width","116px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":58,"width":116}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","58px"],["width","116px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","58px"],["width","116px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","58px"],["width","116px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-known-mouseup-delta.golden.json b/__tests__/golden/__golden__/browser-known-mouseup-delta.golden.json index 819e9519..700fbb19 100644 --- a/__tests__/golden/__golden__/browser-known-mouseup-delta.golden.json +++ b/__tests__/golden/__golden__/browser-known-mouseup-delta.golden.json @@ -1,10 +1,10 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.5: mouseup delta is dropped and stop reports the last move","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-known-mouseup-delta","opts":{},"pointer":"mouse","points":[[10,10]],"scale":1,"up":[30,30],"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-lock-max-binding.golden.json b/__tests__/golden/__golden__/browser-lock-max-binding.golden.json index d1885f97..28d5e550 100644 --- a/__tests__/golden/__golden__/browser-lock-max-binding.golden.json +++ b/__tests__/golden/__golden__/browser-lock-max-binding.golden.json @@ -1,10 +1,10 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":50,"kind":"default","knownBug":"5.1: independent max clamping distorts the aspect ratio","lock":true,"max":[120,1000],"min":[20,20],"mode":"follow","name":"browser-lock-max-binding","opts":{},"pointer":"mouse","points":[[50,0]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-scale-0.5-nw.golden.json b/__tests__/golden/__golden__/browser-scale-0.5-nw.golden.json index bf93209e..88253a56 100644 --- a/__tests__/golden/__golden__/browser-scale-0.5-nw.golden.json +++ b/__tests__/golden/__golden__/browser-scale-0.5-nw.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-scale-0.5-nw","opts":{},"pointer":"mouse","scale":0.5,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":140,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"140px","tag":"div","width":"140px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":140,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","140px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-scale-0.5-se.golden.json b/__tests__/golden/__golden__/browser-scale-0.5-se.golden.json index d80b41d9..f5a8fbc5 100644 --- a/__tests__/golden/__golden__/browser-scale-0.5-se.golden.json +++ b/__tests__/golden/__golden__/browser-scale-0.5-se.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-scale-0.5-se","opts":{},"pointer":"mouse","scale":0.5,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":220,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"220px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-scale-2-nw.golden.json b/__tests__/golden/__golden__/browser-scale-2-nw.golden.json index 59922a6b..c70dd67c 100644 --- a/__tests__/golden/__golden__/browser-scale-2-nw.golden.json +++ b/__tests__/golden/__golden__/browser-scale-2-nw.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-scale-2-nw","opts":{},"pointer":"mouse","scale":2,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":115,"width":115}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":115,"width":115}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","105px"],["width","105px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":115,"width":115}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":115,"width":115}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-scale-2-se.golden.json b/__tests__/golden/__golden__/browser-scale-2-se.golden.json index 847e6950..f0756d70 100644 --- a/__tests__/golden/__golden__/browser-scale-2-se.golden.json +++ b/__tests__/golden/__golden__/browser-scale-2-se.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-scale-2-se","opts":{},"pointer":"mouse","scale":2,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":115}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","105px"],["width","105px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":115,"width":115}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/browser-strict-box.golden.json b/__tests__/golden/__golden__/browser-strict-box.golden.json index 966eda43..5f732a72 100644 --- a/__tests__/golden/__golden__/browser-strict-box.golden.json +++ b/__tests__/golden/__golden__/browser-strict-box.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"browser-strict-box","opts":{},"pointer":"mouse","scale":1,"strict":true,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"170px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"180px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"260px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"270px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"290px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"310px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"350px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"360px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","170px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","180px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","200px"],["width","200px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","210px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","260px"],["width","230px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","270px"],["width","240px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","290px"],["width","260px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","310px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","350px"],["width","320px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","360px"],["width","340px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/cadence-B-stale-props-255.golden.json b/__tests__/golden/__golden__/cadence-B-stale-props-255.golden.json index f987742d..458ebf43 100644 --- a/__tests__/golden/__golden__/cadence-B-stale-props-255.golden.json +++ b/__tests__/golden/__golden__/cadence-B-stale-props-255.golden.json @@ -1,14 +1,14 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"cadence-B-stale-props-255","opts":{},"pointer":"mouse","points":[[10,10],[20,20],[20,20],[30,30]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":6,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/callback-false-is-ignored.golden.json b/__tests__/golden/__golden__/callback-false-is-ignored.golden.json index d7937597..2d16526a 100644 --- a/__tests__/golden/__golden__/callback-false-is-ignored.golden.json +++ b/__tests__/golden/__golden__/callback-false-is-ignored.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"callback-false-is-ignored","opts":{},"pointer":"mouse","returnFalse":true,"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/controlled-clamp.golden.json b/__tests__/golden/__golden__/controlled-clamp.golden.json index d6f38f96..d2954323 100644 --- a/__tests__/golden/__golden__/controlled-clamp.golden.json +++ b/__tests__/golden/__golden__/controlled-clamp.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"clamp","name":"controlled-clamp","opts":{},"pointer":"mouse","points":[[40,40],[80,80],[50,50]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":140,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":40,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":80,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":150,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":50,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":150,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":50,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":140,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":40,"clientY":40,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":180,"width":180}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":80,"clientY":80,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":150,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":50,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":150,"width":150}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":50,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"115px","tag":"div","width":"115px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","115px"],["width","115px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/controlled-frozen.golden.json b/__tests__/golden/__golden__/controlled-frozen.golden.json index b6c358c7..d28647f4 100644 --- a/__tests__/golden/__golden__/controlled-frozen.golden.json +++ b/__tests__/golden/__golden__/controlled-frozen.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"frozen","name":"controlled-frozen","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/draggable-cancel.golden.json b/__tests__/golden/__golden__/draggable-cancel.golden.json index fb897a88..5758feb1 100644 --- a/__tests__/golden/__golden__/draggable-cancel.golden.json +++ b/__tests__/golden/__golden__/draggable-cancel.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"draggable-cancel","opts":{"cancel":".react-resizable-handle"},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":0,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":0,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/draggable-disabled.golden.json b/__tests__/golden/__golden__/draggable-disabled.golden.json index f655e7fb..42882662 100644 --- a/__tests__/golden/__golden__/draggable-disabled.golden.json +++ b/__tests__/golden/__golden__/draggable-disabled.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"draggable-disabled","opts":{"disabled":true},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":0,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":0,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/draggable-double-scale.golden.json b/__tests__/golden/__golden__/draggable-double-scale.golden.json index 065c3563..bae130cd 100644 --- a/__tests__/golden/__golden__/draggable-double-scale.golden.json +++ b/__tests__/golden/__golden__/draggable-double-scale.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"draggable-double-scale","opts":{"scale":2},"pointer":"mouse","scale":2,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"102.5px","tag":"div","width":"102.5px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"105px","tag":"div","width":"105px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":102.5,"width":102.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","102.5px"],["width","102.5px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":105,"width":105}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","105px"],["width","105px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","107.5px"],["width","107.5px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":107.5,"width":107.5}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","107.5px"],["width","107.5px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","107.5px"],["width","107.5px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"107.5px","tag":"div","width":"107.5px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","107.5px"],["width","107.5px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/draggable-handle-selector.golden.json b/__tests__/golden/__golden__/draggable-handle-selector.golden.json index 2eb5e718..9013bb17 100644 --- a/__tests__/golden/__golden__/draggable-handle-selector.golden.json +++ b/__tests__/golden/__golden__/draggable-handle-selector.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"draggable-handle-selector","opts":{"handle":".does-not-match"},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":0,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":0,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/draggable-no-user-select.golden.json b/__tests__/golden/__golden__/draggable-no-user-select.golden.json index a4364e04..e420d891 100644 --- a/__tests__/golden/__golden__/draggable-no-user-select.golden.json +++ b/__tests__/golden/__golden__/draggable-no-user-select.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"draggable-no-user-select","opts":{"enableUserSelectHack":false},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/grid-relative-deltas.golden.json b/__tests__/golden/__golden__/grid-relative-deltas.golden.json index 83d57d9e..b061433d 100644 --- a/__tests__/golden/__golden__/grid-relative-deltas.golden.json +++ b/__tests__/golden/__golden__/grid-relative-deltas.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"grid-relative-deltas","opts":{"grid":[10,10]},"pointer":"mouse","points":[[2,2],[6,6],[14,14],[26,26]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":2,"clientY":2,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":6,"clientY":6,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":14,"clientY":14,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":26,"clientY":26,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":26,"clientY":26,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":4,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":4,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":2,"clientY":2,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":6,"clientY":6,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":14,"clientY":14,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":26,"clientY":26,"target":"document","type":"mousemove"},"rectReads":{"box":5,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":26,"clientY":26,"target":"document","type":"mouseup"},"rectReads":{"box":6,"handle":4,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":6,"handle":4,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/handle-size-large.golden.json b/__tests__/golden/__golden__/handle-size-large.golden.json index c1f6eba8..9d2fcfa7 100644 --- a/__tests__/golden/__golden__/handle-size-large.golden.json +++ b/__tests__/golden/__golden__/handle-size-large.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[50,50],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"handle-size-large","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/handle-size-small.golden.json b/__tests__/golden/__golden__/handle-size-small.golden.json index 07931414..17ea06fa 100644 --- a/__tests__/golden/__golden__/handle-size-small.golden.json +++ b/__tests__/golden/__golden__/handle-size-small.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[5,5],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"handle-size-small","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-aspect-max-drift-batched.golden.json b/__tests__/golden/__golden__/known-aspect-max-drift-batched.golden.json index ce9b0fe1..a9a722db 100644 --- a/__tests__/golden/__golden__/known-aspect-max-drift-batched.golden.json +++ b/__tests__/golden/__golden__/known-aspect-max-drift-batched.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"batched","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":50,"kind":"default","knownBug":"5.1: binding max distorts the ratio even when props remain stale","lock":true,"max":[120,1000],"min":[20,20],"mode":"follow","name":"known-aspect-max-drift-batched","opts":{},"pointer":"mouse","points":[[50,0],[100,0],[100,60]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":82,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":76.4,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":76.4,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":60,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"76.4px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"76.4px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":82,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":76.4,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":76.4,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":60,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","76.4px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","76.4px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"76.4px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","76.4px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-aspect-max-drift.golden.json b/__tests__/golden/__golden__/known-aspect-max-drift.golden.json index da6966b1..51136df3 100644 --- a/__tests__/golden/__golden__/known-aspect-max-drift.golden.json +++ b/__tests__/golden/__golden__/known-aspect-max-drift.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":50,"kind":"default","knownBug":"5.1: binding max distorts the ratio and subsequent projections drift","lock":true,"max":[120,1000],"min":[20,20],"mode":"follow","name":"known-aspect-max-drift","opts":{},"pointer":"mouse","points":[[50,0],[100,0],[100,60]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"70px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":91.76165803108807,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"91.76165803108807px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":113.90046800443372,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"113.90046800443372px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":113.90046800443372,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"113.90046800443372px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":60,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"113.90046800443372px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":70,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","70px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":50,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":91.76165803108807,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","91.76165803108807px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":113.90046800443372,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","113.90046800443372px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":60,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":113.90046800443372,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","113.90046800443372px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":100,"clientY":60,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","113.90046800443372px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"113.90046800443372px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","113.90046800443372px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-axis-none.golden.json b/__tests__/golden/__golden__/known-axis-none.golden.json index 494f3812..281b1698 100644 --- a/__tests__/golden/__golden__/known-axis-none.golden.json +++ b/__tests__/golden/__golden__/known-axis-none.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"none","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.9: axis none suppresses start and stop but activates user-select styles","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-axis-none","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-box-missing-width.golden.json b/__tests__/golden/__golden__/known-box-missing-width.golden.json index df0ce340..a2258b4c 100644 --- a/__tests__/golden/__golden__/known-box-missing-width.golden.json +++ b/__tests__/golden/__golden__/known-box-missing-width.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"y","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.3a: optional width produces NaN in resize callbacks","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-box-missing-width","opts":{},"pointer":"mouse","scale":1,"width":{"$undefined":true}}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"110px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"120px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":""},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-box-resize-after-stop.golden.json b/__tests__/golden/__golden__/known-box-resize-after-stop.golden.json index 322acad6..ba90be6d 100644 --- a/__tests__/golden/__golden__/known-box-resize-after-stop.golden.json +++ b/__tests__/golden/__golden__/known-box-resize-after-stop.golden.json @@ -1,13 +1,13 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"native-burst","component":"ResizableBox","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.4: pending user onResize callbacks commit after onResizeStop","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-box-resize-after-stop","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}},{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"flush"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:se"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-draggable-handlers-overwritten.golden.json b/__tests__/golden/__golden__/known-draggable-handlers-overwritten.golden.json index 311016ad..6ff1a291 100644 --- a/__tests__/golden/__golden__/known-draggable-handlers-overwritten.golden.json +++ b/__tests__/golden/__golden__/known-draggable-handlers-overwritten.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.6: onStart onDrag onStop and nodeRef in draggableOpts are overwritten","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-draggable-handlers-overwritten","opts":{},"pointer":"mouse","scale":1,"userHandlers":true,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"name":"draggableOpts.onMouseDown","value":"called"},{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"name":"draggableOpts.onMouseDown","value":"called"},{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-element-ref-overwritten.golden.json b/__tests__/golden/__golden__/known-element-ref-overwritten.golden.json index 7d9ade37..89b7f4fb 100644 --- a/__tests__/golden/__golden__/known-element-ref-overwritten.golden.json +++ b/__tests__/golden/__golden__/known-element-ref-overwritten.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"element","knownBug":"5.11: the supplied element ref never receives the handle","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-element-ref-overwritten","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"name":"userRef","value":"null"}],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"se","className":"element-handle","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-function-without-ref.golden.json b/__tests__/golden/__golden__/known-function-without-ref.golden.json index 5945c272..c43e0012 100644 --- a/__tests__/golden/__golden__/known-function-without-ref.golden.json +++ b/__tests__/golden/__golden__/known-function-without-ref.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"fn-no-ref","knownBug":"5.7: function handle without forwarding the ref throws on mousedown","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-function-without-ref","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[" not mounted on DragStart!"],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":0,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[" not mounted on DragStart!"],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":0,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"function-handle function-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-incompatible-axis.golden.json b/__tests__/golden/__golden__/known-incompatible-axis.golden.json index c1ef07a3..256d7035 100644 --- a/__tests__/golden/__golden__/known-incompatible-axis.golden.json +++ b/__tests__/golden/__golden__/known-incompatible-axis.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["n"],"height":100,"kind":"default","knownBug":"5.9: an incompatible handle suppresses start and stop","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-incompatible-axis","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":1,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":0,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":0,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:n"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-lock-axis-x.golden.json b/__tests__/golden/__golden__/known-lock-axis-x.golden.json index 49a32886..2d23a11f 100644 --- a/__tests__/golden/__golden__/known-lock-axis-x.golden.json +++ b/__tests__/golden/__golden__/known-lock-axis-x.golden.json @@ -1,10 +1,10 @@ {"scenario":{"anchor":"topleft","axis":"x","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":50,"kind":"default","knownBug":"5.2: aspect projection changes height with axis x","lock":true,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-lock-axis-x","opts":{},"pointer":"mouse","points":[[20,0]],"scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"50px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":58,"width":116}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":58,"width":116}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":50,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","50px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":58,"width":116}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","58px"],["width","116px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":0,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":58,"width":116}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","58px"],["width","116px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":0,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","58px"],["width","116px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"58px","tag":"div","width":"116px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","58px"],["width","116px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-lock-zero-height.golden.json b/__tests__/golden/__golden__/known-lock-zero-height.golden.json index 5c9ca534..23f8100a 100644 --- a/__tests__/golden/__golden__/known-lock-zero-height.golden.json +++ b/__tests__/golden/__golden__/known-lock-zero-height.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":0,"kind":"default","knownBug":"5.3b: infinite aspect ratio produces NaN sizes","lock":true,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[0,0],"mode":"follow","name":"known-lock-zero-height","opts":{},"pointer":"mouse","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","0px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","0px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","0px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","0px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","0px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","0px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","0px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","0px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"0px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","0px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-mouseup-delta.golden.json b/__tests__/golden/__golden__/known-mouseup-delta.golden.json index 6ce3d996..15fc9768 100644 --- a/__tests__/golden/__golden__/known-mouseup-delta.golden.json +++ b/__tests__/golden/__golden__/known-mouseup-delta.golden.json @@ -1,10 +1,10 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.5: mouseup delta is dropped and stop reports the last move","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-mouseup-delta","opts":{},"pointer":"mouse","points":[[10,10]],"scale":1,"up":[30,30],"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":3,"handle":3,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-scale-zero.golden.json b/__tests__/golden/__golden__/known-scale-zero.golden.json index 430d5c71..ffc55d19 100644 --- a/__tests__/golden/__golden__/known-scale-zero.golden.json +++ b/__tests__/golden/__golden__/known-scale-zero.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","knownBug":"5.3c: zero transformScale produces nonfinite sizes","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-scale-zero","opts":{},"pointer":"mouse","scale":0,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":{"$number":"NaN"},"width":{"$number":"NaN"}}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/known-start-constrained.golden.json b/__tests__/golden/__golden__/known-start-constrained.golden.json index dd7a0c56..afd96313 100644 --- a/__tests__/golden/__golden__/known-start-constrained.golden.json +++ b/__tests__/golden/__golden__/known-start-constrained.golden.json @@ -1,11 +1,11 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":10,"kind":"default","knownBug":"5.8: start reports constrained dimensions before the DOM has that size","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"known-start-constrained","opts":{},"pointer":"mouse","points":[[5,5],[15,15]],"scale":1,"width":10}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"10px","tag":"div","width":"10px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","10px"],["width","10px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"10px","tag":"div","width":"10px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":20,"width":20}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"10px","tag":"div","width":"10px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"10px","tag":"div","width":"10px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":5,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":25,"width":25}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"25px","tag":"div","width":"25px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":15,"clientY":15,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":25,"width":25}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"25px","tag":"div","width":"25px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":15,"clientY":15,"target":"document","type":"mouseup"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"25px","tag":"div","width":"25px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":4,"handle":4,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","10px"],["width","10px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":20,"width":20}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","10px"],["width","10px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","10px"],["width","10px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":5,"clientY":5,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":25,"width":25}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","25px"],["width","25px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":15,"clientY":15,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":25,"width":25}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","25px"],["width","25px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":15,"clientY":15,"target":"document","type":"mouseup"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","25px"],["width","25px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":4,"handle":4,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"25px","tag":"div","width":"25px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","25px"],["width","25px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/strict-box.golden.json b/__tests__/golden/__golden__/strict-box.golden.json index e6eaa693..7276eb0b 100644 --- a/__tests__/golden/__golden__/strict-box.golden.json +++ b/__tests__/golden/__golden__/strict-box.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"ResizableBox","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"strict-box","opts":{},"pointer":"mouse","scale":1,"strict":true,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"170px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"180px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"220px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"260px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"270px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"290px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"310px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"350px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"360px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","170px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","180px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","200px"],["width","200px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","220px"],["width","210px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","260px"],["width","230px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","270px"],["width","240px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","290px"],["width","260px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","310px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","350px"],["width","320px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","360px"],["width","340px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/strict-resizable.golden.json b/__tests__/golden/__golden__/strict-resizable.golden.json index 8b036370..e171d27d 100644 --- a/__tests__/golden/__golden__/strict-resizable.golden.json +++ b/__tests__/golden/__golden__/strict-resizable.golden.json @@ -1,47 +1,47 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["s","w","e","n","sw","nw","se","ne"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"strict-resizable","opts":{},"pointer":"mouse","scale":1,"strict":true,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"100px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"110px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"120px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"130px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"140px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"160px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"160px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"170px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"180px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"190px","tag":"div","width":"190px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"200px","tag":"div","width":"200px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"220px","tag":"div","width":"210px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"250px","tag":"div","width":"220px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"260px","tag":"div","width":"230px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"270px","tag":"div","width":"240px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"280px","tag":"div","width":"250px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"290px","tag":"div","width":"260px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"310px","tag":"div","width":"280px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"340px","tag":"div","width":"310px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"350px","tag":"div","width":"320px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"360px","tag":"div","width":"340px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"s","name":"onResizeStart","node":"handle:s#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:s","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":110,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":130,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"s","name":"onResize","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"s","name":"onResizeStop","node":"handle:s#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"w","name":"onResizeStart","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:w","type":"mousedown"},"rectReads":{"box":6,"handle":6,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":7,"handle":7,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":8,"handle":8,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"w","name":"onResize","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":9,"handle":9,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"w","name":"onResizeStop","node":"handle:w#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":10,"handle":10,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"e","name":"onResizeStart","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:e","type":"mousedown"},"rectReads":{"box":11,"handle":11,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":140}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","140px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":12,"handle":12,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":160}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","160px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":13,"handle":13,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"e","name":"onResize","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":14,"handle":14,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"e","name":"onResizeStop","node":"handle:e#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":15,"handle":15,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"n","name":"onResizeStart","node":"handle:n#1","nodeIsHandle":true,"size":{"height":160,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","160px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:n","type":"mousedown"},"rectReads":{"box":16,"handle":16,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":170,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","170px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":17,"handle":17,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":180,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","180px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":18,"handle":18,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"n","name":"onResize","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":19,"handle":19,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"n","name":"onResizeStop","node":"handle:n#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":20,"handle":20,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"sw","name":"onResizeStart","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":190,"width":190}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","190px"],["width","190px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:sw","type":"mousedown"},"rectReads":{"box":21,"handle":21,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":200,"width":200}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","200px"],["width","200px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":22,"handle":22,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":220,"width":210}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","220px"],["width","210px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":23,"handle":23,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"sw","name":"onResize","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":24,"handle":24,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"sw","name":"onResizeStop","node":"handle:sw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":25,"handle":25,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":250,"width":220}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","250px"],["width","220px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"mousedown"},"rectReads":{"box":26,"handle":26,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":260,"width":230}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","260px"],["width","230px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":27,"handle":27,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":270,"width":240}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","270px"],["width","240px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":28,"handle":28,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":29,"handle":29,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":30,"handle":30,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":280,"width":250}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","280px"],["width","250px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":31,"handle":31,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":290,"width":260}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","290px"],["width","260px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":32,"handle":32,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":310,"width":280}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","310px"],["width","280px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":33,"handle":33,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":34,"handle":34,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"se","name":"onResizeStop","node":"handle:se#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mouseup"},"rectReads":{"box":35,"handle":35,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"ne","name":"onResizeStart","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":340,"width":310}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","340px"],["width","310px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:ne","type":"mousedown"},"rectReads":{"box":36,"handle":36,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":350,"width":320}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","350px"],["width","320px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":-10,"target":"document","type":"mousemove"},"rectReads":{"box":37,"handle":37,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":360,"width":340}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","360px"],["width","340px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":20,"clientY":-20,"target":"document","type":"mousemove"},"rectReads":{"box":38,"handle":38,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"ne","name":"onResize","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mousemove"},"rectReads":{"box":39,"handle":39,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mouseup","handle":"ne","name":"onResizeStop","node":"handle:ne#1","nodeIsHandle":true,"size":{"height":370,"width":370}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"clientX":30,"clientY":-30,"target":"document","type":"mouseup"},"rectReads":{"box":40,"handle":40,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":40,"handle":40,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","height":"370px","tag":"div","width":"370px"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:s","handle:w","handle:e","handle:n","handle:sw","handle:nw","handle:se","handle:ne"],"className":"child outer react-resizable","style":[["color","red"],["height","370px"],["width","370px"]],"tag":"div"},"handles":[{"axis":"s","className":"react-resizable-handle react-resizable-handle-s","node":"handle:s#1","tag":"span"},{"axis":"w","className":"react-resizable-handle react-resizable-handle-w","node":"handle:w#1","tag":"span"},{"axis":"e","className":"react-resizable-handle react-resizable-handle-e","node":"handle:e#1","tag":"span"},{"axis":"n","className":"react-resizable-handle react-resizable-handle-n","node":"handle:n#1","tag":"span"},{"axis":"sw","className":"react-resizable-handle react-resizable-handle-sw","node":"handle:sw#1","tag":"span"},{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"},{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"},{"axis":"ne","className":"react-resizable-handle react-resizable-handle-ne","node":"handle:ne#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/touch-nw-moving-layout.golden.json b/__tests__/golden/__golden__/touch-nw-moving-layout.golden.json index 3bd3501a..55580561 100644 --- a/__tests__/golden/__golden__/touch-nw-moving-layout.golden.json +++ b/__tests__/golden/__golden__/touch-nw-moving-layout.golden.json @@ -1,12 +1,12 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"touch-nw-moving-layout","opts":{},"pointer":"touch","scale":1,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"120px","tag":"div","width":"120px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchend","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":120,"width":120}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","120px"],["width","120px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":3,"handle":3,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"touchmove"},"rectReads":{"box":4,"handle":4,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchend","handle":"nw","name":"onResizeStop","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":130,"width":130}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"touchend"},"rectReads":{"box":5,"handle":5,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"animation-frame"},"rectReads":{"box":5,"handle":5,"other":0}} ], -"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"130px","tag":"div","width":"130px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} +"final":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","130px"],["width","130px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}} diff --git a/__tests__/golden/__golden__/unmount-mouse.golden.json b/__tests__/golden/__golden__/unmount-mouse.golden.json index cafff82c..6636aaea 100644 --- a/__tests__/golden/__golden__/unmount-mouse.golden.json +++ b/__tests__/golden/__golden__/unmount-mouse.golden.json @@ -1,9 +1,9 @@ {"scenario":{"anchor":"topleft","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["se"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"unmount-mouse","opts":{},"pointer":"mouse","scale":1,"unmount":true,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"synthetic","eventType":"mousedown","handle":"se","name":"onResizeStart","node":"handle:se#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:se","type":"mousedown"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"mousemove","handle":"se","name":"onResize","node":"handle:se#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:se"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"se","className":"react-resizable-handle react-resizable-handle-se","node":"handle:se#1","tag":"span"}]},"errors":[],"input":{"clientX":10,"clientY":10,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, {"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"type":"unmount"},"rectReads":{"box":2,"handle":2,"other":0}}, {"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"clientX":20,"clientY":20,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, {"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"clientX":30,"clientY":30,"target":"document","type":"mousemove"},"rectReads":{"box":2,"handle":2,"other":0}}, diff --git a/__tests__/golden/__golden__/unmount-touch.golden.json b/__tests__/golden/__golden__/unmount-touch.golden.json index a6380d4c..d6b26842 100644 --- a/__tests__/golden/__golden__/unmount-touch.golden.json +++ b/__tests__/golden/__golden__/unmount-touch.golden.json @@ -1,9 +1,9 @@ {"scenario":{"anchor":"bottomright","axis":"both","cadence":"per-event","component":"Resizable","handleSize":[20,20],"handles":["nw"],"height":100,"kind":"default","lock":false,"max":[{"$number":"Infinity"},{"$number":"Infinity"}],"min":[20,20],"mode":"follow","name":"unmount-touch","opts":{},"pointer":"touch","scale":1,"unmount":true,"width":100}, -"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, +"initial":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]}, "steps":[ -{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"100px","tag":"div","width":"100px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, -{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","height":"110px","tag":"div","width":"110px"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, +{"calls":[],"dom":{"bodyUserSelect":false,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"type":"mount"},"rectReads":{"box":0,"handle":0,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchstart","handle":"nw","name":"onResizeStart","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":100,"width":100}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","100px"],["width","100px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":0,"clientY":0,"target":"handle:nw","type":"touchstart"},"rectReads":{"box":1,"handle":1,"other":0}}, +{"calls":[{"eventKind":"native","eventType":"touchmove","handle":"nw","name":"onResize","node":"handle:nw#1","nodeIsHandle":true,"size":{"height":110,"width":110}}],"dom":{"bodyUserSelect":true,"box":{"attrs":[["data-probe","passthrough"],["title","original-child"]],"childOrder":["content","handle:nw"],"className":"child outer react-resizable","style":[["color","red"],["height","110px"],["width","110px"]],"tag":"div"},"handles":[{"axis":"nw","className":"react-resizable-handle react-resizable-handle-nw","node":"handle:nw#1","tag":"span"}]},"errors":[],"input":{"clientX":-10,"clientY":-10,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, {"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"type":"unmount"},"rectReads":{"box":2,"handle":2,"other":0}}, {"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"clientX":-20,"clientY":-20,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, {"calls":[],"dom":{"bodyUserSelect":true,"box":null,"handles":[]},"errors":[],"input":{"clientX":-30,"clientY":-30,"target":"document","type":"touchmove"},"rectReads":{"box":2,"handle":2,"other":0}}, diff --git a/__tests__/golden/browser/run.cjs b/__tests__/golden/browser/run.cjs index fdcf81e0..917c0ddd 100644 --- a/__tests__/golden/browser/run.cjs +++ b/__tests__/golden/browser/run.cjs @@ -8,6 +8,15 @@ const webpack = require('webpack'); const repo = path.resolve(__dirname, '../../..'); const output = fs.mkdtempSync(path.join(os.tmpdir(), 'react-resizable-browser-')); +// In GitHub Actions, also emit a workflow error command so the first lines of +// each failure show up as a check annotation, readable without the full log. +function annotate(title, message) { + if (!process.env.GITHUB_ACTIONS) return; + const body = String(message).split('\n').slice(0, 40).join('\n') + .replace(/%/g, '%25').replace(/\r/g, '%0D').replace(/\n/g, '%0A'); + process.stdout.write(`::error title=${title}::${body}\n`); +} + function bundle() { return new Promise((resolve, reject) => { const compiler = webpack({ @@ -92,6 +101,7 @@ async function main() { fs.writeFileSync(path.join(output, `${name}.actual.json`), JSON.stringify(actual, null, 2) + '\n'); failures.push(name); process.stderr.write(`FAIL ${name}\n${error.stack}\n`); + annotate(`browser parity: ${name}`, error.message); } await page.close(); } @@ -103,6 +113,7 @@ async function main() { } main().catch(error => { + annotate('browser cross-check crashed', error.stack); process.stderr.write(`${error.stack}\nBrowser artifacts: ${output}\n`); process.exitCode = 1; }); diff --git a/__tests__/golden/recorder.ts b/__tests__/golden/recorder.ts index 1d6f5a25..dcb6bbdf 100644 --- a/__tests__/golden/recorder.ts +++ b/__tests__/golden/recorder.ts @@ -20,7 +20,9 @@ export function createRecorder(axes: ResizeHandleAxis[], getContainer: () => HTM const rendered = handles(); return { box: box ? {tag: box.tagName.toLowerCase(), className: box.className, - width: box.style.width, height: box.style.height, + // Every inline style property, not just the size: a refactor that drops + // a user's style must change the trace. + style: Array.from(box.style).sort().map(prop => [prop, box.style.getPropertyValue(prop)]), attrs: Array.from(box.attributes).filter(a => a.name !== 'style' && a.name !== 'class') .map(a => [a.name, a.value]).sort(), childOrder: Array.from(box.children).map(el => el.hasAttribute('data-content') ? 'content' : `handle:${axes[rendered.indexOf(el as HTMLElement)]}`)} : null, From d4d728c51f1d47721a611e02ce60830128963e5c Mon Sep 17 00:00:00 2001 From: Samuel Reed Date: Sat, 31 Oct 2026 17:27:55 -0400 Subject: [PATCH 6/6] test: drain queued frames between gestures in both golden runners Root cause: both runners queue requestAnimationFrame until the final animation-frame step, which also held react-draggable's scheduleRemoveUserSelectStyles cleanup. In browser-strict-box the s drag leaves a native Range selection (handle s to handle se) that covers the w handle. On Linux Chromium the w mousedown lands inside that selection and starts a native drag: dragstart/dragover/dragend replace mousemove/mouseup, so DraggableCore never sees the moves or the release, stays dragging, and later gestures resize through two handles at once (width 1890). Fix: drain queued frames, unrecorded and inside act, before each gesture (goldenBrowser.settle() in app.tsx, called from run.cjs; the same drain in harness.ts), as real frames would between separate drags. The final gesture's cleanup keeps its recorded animation-frame step. No golden files change. Verified: yarn golden:browser 42/42 in mcr.microsoft.com/playwright:v1.62.1-noble and on macOS; yarn test 502/502 with no golden diffs. --- __tests__/golden/README.md | 6 ++++-- __tests__/golden/browser/README.md | 6 +++++- __tests__/golden/browser/app.tsx | 6 ++++++ __tests__/golden/browser/run.cjs | 1 + __tests__/golden/harness.ts | 3 +++ 5 files changed, 19 insertions(+), 3 deletions(-) diff --git a/__tests__/golden/README.md b/__tests__/golden/README.md index f6575ec8..1fbafc49 100644 --- a/__tests__/golden/README.md +++ b/__tests__/golden/README.md @@ -49,8 +49,10 @@ coordinates relative to the offset parent. This makes north/west correction observable. The layout patch restores the original own property descriptors, including the absence of a descriptor. It does not stub drag handlers. -Animation frames drain at an explicit checkpoint so selection cleanup does not -depend on wall-clock timing. The recorder never reads layout itself. +Animation frames drain at explicit checkpoints so selection cleanup does not +depend on wall-clock timing. Frames queued by one gesture drain, unrecorded, +before the next gesture starts, as real frames would between separate drags. +The final gesture's frames drain in the recorded `animation-frame` step. The recorder never reads layout itself. ## Known bugs diff --git a/__tests__/golden/browser/README.md b/__tests__/golden/browser/README.md index 9411b27a..1a2852af 100644 --- a/__tests__/golden/browser/README.md +++ b/__tests__/golden/browser/README.md @@ -32,7 +32,11 @@ The full drifting sequence remains pinned in the jsdom suite. Every input runs inside an async React `act` scope. The runner waits for the commit before recording the DOM, matching jsdom's per-event cadence. A controlled -animation-frame queue gives selection cleanup its own final checkpoint. +animation-frame queue drains, unrecorded, before each gesture, and the final +gesture's selection cleanup gets its own recorded checkpoint. Without the +between-gesture drain, the native selection left by one drag survives into the +next mousedown, and Chromium starts a native drag (`dragstart`) instead of +delivering `mousemove` and `mouseup`. The comparison includes ordered callbacks, exact sizes, event type and kind, handle identity, errors, input steps, and every recorded DOM field including diff --git a/__tests__/golden/browser/app.tsx b/__tests__/golden/browser/app.tsx index 0747be35..fe482c7b 100644 --- a/__tests__/golden/browser/app.tsx +++ b/__tests__/golden/browser/app.tsx @@ -58,6 +58,12 @@ function inputs(axis: string): Input[] { initial = recorder.dom(); return (scenario.active ?? scenario.handles).map(axis => ({axis, inputs: inputs(axis)})); }, + // Real frames run between separate gestures. Drain the previous gesture's + // scheduled cleanup, unrecorded, so its native selection cannot leak into + // the next mousedown (Chromium would start a native drag from it). + async settle() { + await React.act(async () => { for (const callback of frames.splice(0)) callback(0); }); + }, origin(axis: string) { const handle = recorder.handles()[scenario.handles.indexOf(axis as any)]; const rect = handle.getBoundingClientRect(); diff --git a/__tests__/golden/browser/run.cjs b/__tests__/golden/browser/run.cjs index 917c0ddd..04ae4c86 100644 --- a/__tests__/golden/browser/run.cjs +++ b/__tests__/golden/browser/run.cjs @@ -69,6 +69,7 @@ async function main() { await page.goto(url); const gestures = await page.evaluate(name => window.goldenBrowser.mount(name), name); for (const gesture of gestures) { + await page.evaluate(() => window.goldenBrowser.settle()); const origin = await page.evaluate(axis => window.goldenBrowser.origin(axis), gesture.axis); await page.mouse.move(origin.x, origin.y); for (const input of gesture.inputs) { diff --git a/__tests__/golden/harness.ts b/__tests__/golden/harness.ts index 6ec9f872..008d6c0c 100644 --- a/__tests__/golden/harness.ts +++ b/__tests__/golden/harness.ts @@ -109,6 +109,9 @@ export async function runScenario(scenario: Scenario) { } }; for (const axis of s.active ?? s.handles) { + // Real frames run between separate gestures: drain the previous gesture's + // scheduled cleanup, unrecorded, matching the browser runner's settle(). + act(() => { for (const callback of frames.splice(0)) callback(0); }); if (s.cadence === 'batched') { act(() => { gesture(axis); recorder.begin({type: 'flush'}); }); recorder.end();